Click here to Skip to main content
Click here to Skip to main content

AJAX DataGrid(with client-side paging ) at glance

, 12 Mar 2006
Rate this:
Please Sign up or sign in to vote.
Genric AJAX library (fill textbox, dropdown, datagrid).

Sample Image - Ajax_DataGrid_at_glance.jpg


 Hi there of course all of you hear about Ajax  Wink | ;) and about its performance,but the main problem is you have to write Javascript function for each case also I didn't found any code to fill Datagrid(note: Datagrid is converted to Html Table at Client-side) with Ajax so I decided to write  generic JavaScipt library for Ajax and also support Datagrid with paging.

How to run demo

you have to change database connection string in web.config also you have to change

javascript variable called:

var serverURL="<A href=""></A>"

to you machine IP all of three files(AjaxLibHH09b.js,AjaxLibWS09b.js & HtmlTable2.aspx)

1]-I attach to projects you can use any of them

    a-GenricAjaxWS: it is HttpHandler webservice you call it like that

       http://localhost/GenricAjaxWS/GenricAjaxWS.asmx/GetData?sqlStr=select getdate()

       it returns XML DataSet.(of course 'select getdate()' is your sql select statement)


   b-GenricAjaxHH: it is  you call it like that


     but it works faster than Webservice(you must test it).

2]-to use GenricAjaxWS version use AjaxLibWS09b.js, to use  GenricAjaxHH version use AjaxLibhh09b.js


The files(AjaxLibWS09b.js,AjaxLibHH09b.js) contains javascript function

called FillTable(mySelect,myDiv,myDataGridName,pageSize,sqlStr) it takes 5 parameters

1]-mySelect:dropdown list name(to filter datagrid).

2]-myDiv:html Div (to place grid on it).

3]-myDataGridName:datagrid name

4]-pageSize:count of rows in each datagrid page

5]-sqlStr:sql select statement.

there are another Function called FillTable(myDiv,myDataGridName,pageSize,sqlStr)

it works like the above but it doesn't take dropdown list name.

to use it you have to add this controls to you page

a]-add html hidden input called DataGrid1__PAGENUM.

b]-add html div and add id attribute to it(you will use this id).

c]-add any control to fire Fill function and add this line of code in page load

   'SELECT title,type,pub_id,price,advance FROM titles');");

while 'button1' is your control name

d]-add javascript file to project.

e]-add script tag in page head(in aspx) to map to script file.

and have fun.


there are some other functions

1]-FillTextBoxesFromDDLOnChange(mySelect,ar2,sqlStr):to fill a list of textboxes according to dropdown selection

   'TextBox3','TextBox4','TextBox5'], 'SELECT title,type," + 
   "pub_id,price,advance FROM titles where title_id=');");

2]-FillDropDownFromDropDown(mySelect,mySelect2,sqlStr):to filter dropdown from another dropdown

   'SELECT fname,emp_id FROM employee WHERE pub_id=');");

3]-FillDDL(mySelect,sqlStr)&clearDDL(mySelect): to fill and clear dropdown.




2-Client-side paging for DataGrids


This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


About the Author

Taha Amin
Egypt Egypt
Senior Development Manager, with 11 years of experience. Focused on design/developing/delivery B/OSS modules to satisfy customer/business requirements in accordance to TM Forum's TAM/SID framework. Excellent communication and interpersonal skills, flexibility, ability to adjust to new people and situations, strong problem solving skills and willing to work effectively and efficiently. Gained additional leadership skills such as: - High effective mentorship and coaching - Clearly communication and solutions sharing with my team - Decision making
Follow on   Twitter   LinkedIn

Comments and Discussions

Generalcode PinmemberMember #380403121-Feb-07 1:46 
GeneralUsing Pinmembernik_crash13-Sep-05 21:05 
GeneralSQL Injection Pinmemberbigals15-Aug-05 14:08 
GeneralRe: SQL Injection PinmemberTaha Zayed15-Aug-05 23:09 
GeneralRe: SQL Injection PinmemberMika17-Aug-05 0:51 
GeneralRe: SQL Injection PinmemberJohn Goodwin17-Aug-05 7:29 
GeneralRe: SQL Injection PinmemberTaha Zayed17-Aug-05 20:58 
GeneralRe: SQL Injection PinmemberTaha Zayed17-Aug-05 21:06 
GeneralRe: SQL Injection PinmemberTaha Zayed18-Aug-05 13:16 
GeneralRe: SQL Injection PinmemberMark Brandon25-Aug-05 5:08 
GeneralRe: SQL Injection PinmemberTaha Zayed25-Aug-05 5:33 
GeneralRe: SQL Injection PinmemberMark Brandon25-Aug-05 6:12 
GeneralRe: SQL Injection PinmemberTaha Zayed25-Aug-05 6:26 
GeneralRe: SQL Injection PinmemberMark Brandon25-Aug-05 6:57 
GeneralRe: SQL Injection - encrypting javascript Pinmemberegozi1314-Mar-06 8:01 
GeneralRe: SQL Injection - encrypting javascript PinmemberTaha Zayed14-Mar-06 21:49 
GeneralThis is not encryption, but merely encoding Pinmemberegozi1315-Mar-06 7:03 
GeneralRe: This is encryption, but merely encoding PinmemberTaha Zayed15-Mar-06 8:22 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.150301.1 | Last Updated 12 Mar 2006
Article Copyright 2005 by Taha Amin
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid