»Dotnet Ads
»Message Boards
Message Boards
Dotnet Books
»Member Details
Register
Login
LogOut
Submit Code
Submit Jobs
Submit Projects
»Competition
Community
Winners
Prizes
Write For Us
Members
»Other Resources
Links
Dotnet Resources
|
Displaying a DataGrid in ASP.NET using AJAXIntroduction
The latest buzz among web programmers is AJAX. Well AJAX is nothing new it has been around a while it is nothing but remote scripting. AJAX is an acronym that stands for Asynchronous JavaScript and XML. You see AJAX is used every where now. Google is an example. It is just the process of making an out - of - band call (e.g.: not with the normal page POST / RELOAD cycle) to some external resource, getting back the result either synchronously or asynchronously, and updating the content of the page that initiated the call, usually using client-side HTML DOM methods.
In this article I will show you how to use AJAX to display a datagrid dynamically. I assume that you know how to use visual studio to create web pages and HTML forms. Actually i was given this daunting task of converting the existing applications in our company to use ajax. so i had to find a way to do it using the same page instead of creating a new page for every page which had to use AJAX.
The Steps:
1.Create the client page
2.Add the JavaScript code
3.Create the code remote .aspx page
Step1:
Open visual studio and create a new project called whatever I used the name ajax by default visual studio creates a page Webapplication1.aspx . note I am using C# as the code behind. Rename the webapplication1.aspx page to ajax.aspx
Step2:
Drag and drop a datagrid control from the web forms toolbox on to the page. Give the datagrid a id of dgView. Drag and drop a html text field from the HTML toolbox. Give it a name txtSearch. Drag and drop a HTML button from the HTML toolbox. Name it btnSubmit. In the HTML view add the div tag which is used to show the populated data any where after the form fields
Step3:
Aha now comes the JavaScript code the code is below. Don’t worry I will explain how each function works. Add this code in top of the page. Well this code is the bread and butter of this script :).
© 2008 dotnetwatch.com -- Privacy policy
|