Custom paging in asp.net with Jquery

Here I have created a custom grid with Jquery in Asp.net. When we use web control (datagrid, GridView etc.) in asp.net to show the information then it takes time as the number of users increased. As well as if we have to go for the next page in the Gridview a postback happened and it increase the load on the server. I have used here a Jquery Ajax method to fetch and save the data without postback.



Steps:

1. Here I have used Link To SQL for the datalayer. I have created the procedures to insertUser (to insert the new user) , GetTotalUserCount (get the total number of users) and GetAllUsers (to fetch all the users).
2. Created a class user in the datalayer to fetch the users by pageSize, pageNo and SortColumn.
3. Created a BusinessLayer.
4. Created JSONHelper.JSON and added the reference to the BusinessLayer. JSONHelper.JSON is used to convert the object to the Json string.
5. Included the jquery-1.3.2.min.js in the default.aspx page. No need to write any server site code. You can also use any .html page instead of .aspx page.
6. Include CustomeUserGrid.js and Employee.js files where I fetch the data from the database and also save the new user information
7. To save/fetch the data from the database with Jquery Ajax method I have created a DataPage.aspx.
8. Restore the database EmployeeManagement.bak.
9. Set the default.aspx page Set as start page.

Technolgoes: asp.net 3.5, Linq to SQL, Jquery

Written By: Pankaj Saha

Download:

Thanks my friend Animesh Singh to help me out for this blog.