Skip to main content

AJAX Extensions on Microsoft Visual Studio 2008

AJAX is a new trend in web development where it gives very smooth functionality for your website. In simple term we can use AJAX technology to refresh individual parts of the web page without refreshing whole page. This feature will increase the efficiency of your web page, smooth operation and enable more description web page design.

What is AJAX?
AJAX = Asynchronous JavaScript and XML.
AJAX is not a new programming language, but a new way to use existing standards.
AJAX is the art of exchanging data with a server, and update parts of a web page - without reloading the whole page.
Microsoft Visual Studio 2008 is coming with rich collection of AJAX controllers built in. AJAX is based on Java and JavaScript so it is nothing to do with .NET or Visual Studio. But most importantly we can easily use AJAX with most of the web development project. With AJAX Extensions of Visual Studio 2008 we can use AJAX with the visual studio development environment. This is really easy and fun. Let do it with a small project, so that you can easily understand the concept.

In this project I will show you how to develop a web page that will display current server time stamp without refreshing web page again and again. To get server time web page should send request, get response and display it. In this basic example I am using ScriptManager and UpdatePanel controllers. ScriptManager is a highlevel controller define with respect to the web page. But you can have one or more UpdatePanel for a given web page. Those UpdatePanel s can be individually update based on deferent events. So you should understand that we can perform several functions on the web page at a given time synchronously using multiple UpdatePanel s.

Fig 1: AJAX Extensions Toolbox

AJAX toolbox contains ScriptManager, ScriptManagerProxy, Timer, UpdatePanel and UpdateProgress controllers. More frequently we use ScriptManger and UpdatePanel. Update panel we use to place controllers that need to get update with the page events, but without page refresh. In this example you can see I have add ScriptManger and UpdatePanel. Within UpdatePanel there is ContentTemplete, inside that you can I have placed two buttons and one label. Once you click on one button it will display the current server time on the label and click on other button will execute javascript method "test".

Fig 2: How to use AJAX ScriptManger





Fig 3: How to use AJAX UpdatePanel





The final step is to write code for server side operations. Write respective server side code inside the particular controllers' (Eg: button, menu...) event handling methods same as you do in normally applications. But here different is this server side code will execute on server and send results to corresponding controller but no page refresh.

Fig 4: How to write server side coding in AJAX

Comments

Popular posts from this blog

PrimeNG UI Components For Angular Application

Getting Started With PrimeNG Styling in Angular App  This chapter we are going to check how you can add PrimeNG card component to show available flowers in the stock. Before styling the app, I have added some images of flowers to our assets folder as below. In app.module.ts file you can import PrimeNG Card module as below. import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { LandingComponent } from './modules/landing/landing.component'; import { HomeComponent } from './modules/home/home.component'; import { CardModule } from 'primeng/card'; ; @NgModule({   declarations: [     AppComponent,     LandingComponent,     HomeComponent   ],   imports: [     BrowserModule,     AppRoutingModule,     CardModule,        ],   provider...

Building robust APIs with Node.js

Node.js is a popular open-source JavaScript runtime environment that allows developers to build scalable and high-performance web applications. One of the key strengths of Node.js is its ability to build APIs quickly and efficiently. APIs, or Application Programming Interfaces, allow different systems to communicate with each other, enabling data exchange and other operations. Building robust APIs with Node.js requires an understanding of RESTful architecture, which is a widely adopted standard for creating APIs. RESTful APIs provide a standardized way to expose data and functionality over the web using a set of HTTP methods such as GET, POST, PUT, and DELETE. To build a robust Node.js API, developers must choose an appropriate framework and set up a development environment. They should also handle errors and exceptions, implement authentication and authorization, and use middleware to enhance the functionality of the API. Writing test cases, documenting the API using tools such as Swa...

SMPP protocol library for fast and easy SMSC(Short Message Service Centre) client development even for non-telecom guys

SMS sending through .NET C# is really easy. But most of the guys face many issues with SMSC client developments. SMPP protocol has many parameters to configure, but for simple SMPP gateway application you need very few of them to configure correctly. This article will cover how to implement SMSC client application using EasySMPP library. EasySMPP is a free SMPP library used by many people to implement SMS sending applications. There are many SMPP libraries but EasySMPP library is very easy to use and relatively stable. EasySMPP library mainly contain five class library projects. KernelParameters, SMPPClient, SMSClient, SMSService and Tools are the library projects and you only need to use SMSClient library to implement SMPP client application. First download EasySMPP library and add class library project to your .NET C# solution.  1. public bool SendSms( string from, string to, string text)