Sample Code for Ajax in C#.net,Asp.net with Ajax.dll

• Download source code - 24.7 Kb

Introduction

Ajax stands for Asynchronous Javascript and XML. Beginners may feel hard when they want to learn Ajax. They may got confused when they get into the samples like Atlas. This article is mainly for beginners of Ajax. The sample code is very easy and self-understandable.

Using The Code

Download the source code , unzip it and configure it in your IIS. The folder "Ajax_CSharp.Net" contains a sub-folder named "DB Table". This sub-folder contains a sql file. Execute the sql in your local sql server. A table with the name "employee" will be created. Add some more data into the table with the insert query in the sql file.

Execute the project Ajax_CSharp.net. Click the button. The button is a html button.It takes employee data from the table 'employee' without page post-back and populate the data in the dropdownlist. When a particular record is selected in the dropdownlist, the selected employee name and employee id willl be displayed in the label.

What is Ajax?

Ajax stands for Asynchronous Javascript and XML. It is a browser technology. This is an combination of Javascript and XML. The data is transfered in the form of XML. XMLHttp object is used in Ajax.

Why Ajax?

Ajax is used to eliminate round-trip to the server, when a request is posted to the server. In simple, we can say that when we want to access the database without page refresh, we can use Ajax.

Source Code

protected void Page_Load(object sender, EventArgs e)
    {
        Ajax.Utility.RegisterTypeForAjax(typeof(Ajax_CSharp));
    }

[Ajax.AjaxMethod(HttpSessionStateRequirement.ReadWrite)]
    public string GetData()
    {
    //contains function to hit database
    }

Using Javascript

Javascript plays an vital role in Ajax. The server side function GetData() is a Ajax function. The function is coded with "[Ajax.AjaxMethod(HttpSessionStateRequirement.ReadWrite)]" which shows that it is an Ajax function. This function is called from javascript in the click event of the button.

The server side function returns some value which is again handled by the javascript. HttpSessionStateRequirement.Readwrite is an optional argument which is used in order to use session variables inside ajax function. One thing we have to remember is that we can't access server side controls inside the GetData() function. Thats why we are returning the data to the javascript and populate dropdownlist from the javascript.

function GetData()
    {
        var response;
        Ajax_CSharp.GetData(GetData_CallBack);    
    }
    
    function GetData_CallBack(response)
    {
        var response=response.value;
     // code to handle response value
        
     }