Jquery + json implement paging effect _ jquery

This article describes in detail how to use jquery and json to achieve paging effect. If you are interested, refer to Json as a lightweight data exchange format, due to the convenience of its data format, today I accidentally want to apply it to paging implementation. Paging is a long-term topic for web development, so the efficiency and importance of its applications will not be discussed much.
Main technologies in this article: reflection mechanism, Json data format, jquery
To ensure the versatility of applications, we must first convert any type of result objects to Json format based on the reflection mechanism.

Public static String toJSON (Object obj) {HashMap map = new HashMap (); Class c = obj. getClass (); // use a reflection system to reflect and use all the attributes in it. In this way, attributes of any object can be found, // encapsulate the names and values of these attributes into a map. Field [] fields = c. getDeclaredFields (); for (int I = 0; I <fields. length; I ++) {String name = fields [I]. getName (); try {fields [I]. setAccessible (true); Object o = fields [I]. get (obj); I f (o instanceof Number) {map. put ("" + name + ", o. toString ();} else if (o instanceof String) {map. put ("" + name + "," + o. toString () + ") ;}} catch (IllegalArgumentException e) {} catch (IllegalAccessException e) {} // convert map object to String // these formats also need to convert = to: String s = map. toString (); // System. out. println (s); String str = s. replaceAll ("" = "," ":"); // System. out. println (str); return str ;}

After converting multiple objects to Json-type objects, add paging information to convert multiple Json strings to the entire Json type.

{"0":{"id":"0", "name":"dong0", "age":21},"1":{"id":"1", "name":"dong1", "age":21},"2":{"id":"2", "name":"dong2", "age":21},"3":{"id":"3", "name":"dong3", "age":21},"4":{"id":"4", "name":"dong4", "age":21},"5":{"id":"5", "name":"dong5", "age":21},"6":{"id":"6", "name":"dong6", "age":21},"7":{"id":"7", "name":"dong7", "age":21},"8":{"id":"8", "name":"dong8", "age":21},"9":{"id":"9", "name":"dong9", "age":21},"10":{"firstPage":1, "currentPage":1, "default_Record_Num":10, "lastPage":10, "frontPage":1, "sum":100, "nextPage":2},"length":11}

When the information is sent to the client, only jquery can receive the data of the object. This allows the foreground style to be separated from the data transmitted in the background, which simplifies the code.

$. GetJSON ("result. jsp? Page = "+ p, function (json) {$ (" # show "example .html ("User IDUser NameUser age"); For (var I = 0; I
 
  
"+ Json [I] [" id "] +""+ Json [I] [" name "] +"
  "+ Json [I] [" age "] +"") ;}$ (" # CurrentPage "). attr ("value", json [json. length-1] ["currentPage"]); $ ("# pageCount "). attr ("value", json [json. length-1] ["lastPage"]) ;});
 

The code for refreshing pagination implemented using JQuery and JSon is as follows:

Four files are required.
One object file CategoryInfoModel. cs
One SqlHelper SQLHelper. cs
An AJAX server processing program PagedService. ashx
One client calls WSXFY.htm
CategoryInfoModel. cs and SQLHelper. cs I will not write any more, and I know what files it is.
The PagedService. ashx code is as follows:

Using System. web. script. serialization; public void ProcessRequest (HttpContext context) {context. response. contentType = "text/plain"; string strAction = context. request ["Action"]; // obtain the page number if (strAction = "GetPageCount") {string strSQL = "select count (*) FROM CategoryInfo"; int intRecordCount = SqlHelper. executeScalar (strSQL); int intPageCount = intRecordCount/10; if (intRecordCount % 10! = 0) {intPageCount ++;} context. response. write (intPageCount);} // obtain else if (strAction = "GetPageData") {string strPageNum = context. request ["PageNum"]; int intPageNum = Convert. toInt32 (strPageNum); int intStartRowIndex = (intPageNum-1) * 10 + 1; int intEndRowIndex = (intPageNum) * 10 + 1; string strSQL = "SELECT * FROM (select id, categoryName, Row_Number () OVER (order by id asc) AS rownum FROM CategoryInfo) AS t "; strSQL + =" WHERE t. rownum> = "+ intStartRowIndex +" AND t. rownum <= "+ intEndRowIndex; DataSet ds = new DataSet (); SqlConnection conn = SqlHelper. getConnection (); ds = SqlHelper. executeDataset (conn, CommandType. text, strSQL); List
 
  
Categoryinfo_list = new List
  
   
(); // Defines the object set for (int I = 0; I <ds. tables [0]. rows. count; I ++) {CategoryInfoModel categoryinfo = new CategoryInfoModel (); categoryinfo. categoryInfoID = Convert. toInt32 (ds. tables [0]. rows [I] ["ID"]); categoryinfo. categoryName = ds. tables [0]. rows [I] ["CategoryName"]. toString (); categoryinfo_list.Add (categoryinfo);} JavaScriptSerializer jss = new JavaScriptSerializer (); context. response. write (jss. serialize (categoryinfo_list); // Serialize the object set as a javascript Object }}
  
 

The WSXFY.htm code is as follows:

 Refreshing pagination