jQuery getJSON() .ashx はページングを実装します (改良版)_jquery

WBOY

リリース： 2016-05-16 17:38:58

オリジナル

1333 人が閲覧しました

参考: http://www.jb51.net/article/35110.htm
改善点:
1. ashx は json データを返し、送信されるデータ量と HTML ページスタイルの制御を削減します。また、より柔軟です。
2. HTML ページの jQuery コードを 1 つに単純化します。

1. テーブルのテストデータを作成します:

コードをコピーしますコードは次のとおりです。 :

create table test(id intidentity,title varchar(36)) 
declare @index int; 
set @index = 1; 8888) 
 begin 
insert test(title) 値 (newid()) 
set @index = @index 1 
end 

 

2. .html ページ

コードをコピーコードは次のとおりです:

type="text/javascript" src=" jquery-1.4.2.min.js">

< ;body>

;
前のページ
次のページ

>

コードは次のとおりです:

public class Handler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
StringBuilder tb = new StringBuilder();
DataBase db = new Database();
int pageSize = 10;
int pageIndex = 0;
文字列タイプ = context.Request.Params["type"];
switch (type)
{
case "first":
DataTable dt1 = db.GetDataSet("select Top 10 * from test", null).Tables[0];
tb.Append(Common.DataTableToJSON(dt1, true)); //DataTable转はJSON
break;
case "next":
pageIndex = Convert.ToInt32(context.Request.Params["index"]);
DataTable dt2 = db.GetDataSet("select top " pageSize.ToString() " * from test where id> (select max(id) from (select top " (pageSize * pageIndex).ToString() " id from test ) t)"、null).Tables[0];
tb.Append(Common.DataTableToJSON(dt2, true));
休憩;
case "pre":
pageIndex = Convert.ToInt32(context.Request.Params["index"]);
DataTable dt3 = db.GetDataSet("select top " pageSize.ToString() " * from test where id> (select max(id) from (select top " (pageSize * pageIndex).ToString() " id from test ) t)"、null).Tables[0];
tb.Append(JSONHelper.DataTableToJSON(dt));
休憩;
}
context.Response.Write(tb.ToString());
}
public bool IsReusable
{
get
{
return false;
}
}
}

四、效果
jQuery getJSON() .ashx はページングを実装します (改良版)_jquery

jQuery getJSON() .ashx はページングを実装します (改良版)_jquery

---------- -------------------------------------------------- -------------------------------------------------- -----
备注 (2010-7-10):
を使用した sql2005 row_number() 分页メソッド、.ashx页面代码可简化は

代制コード代码如下:

 
public class Handler : IHttpHandler 
{ 
public void ProcessRequest(HttpContext context) 
{ 
context .Response.ContentType = "テキスト/プレーン"; 
DataBase db = new Database(); 
int pageSize = 10; 
int pageIndex = 0; 
int.TryParse(context.Request.Params["index"], out pageIndex); 
文字列タイプ = context.Request.Params["type"]; 
string sql = string.Format("select * from ( select row_number() over (order by id) as rowNum,* from test) as t " 
 " where rowNum>{0} and rowNum<={ 1}", pageIndex * pageSize, (pageIndex 1) * pageSize); 
DataTable dt = db.GetDataSet(sql, null).Tables[0]; 
context.Response.Write(JSONHelper.DataTableToJSON(dt)); 
} 
public bool IsReusable 
{ 
get 
{ 
return false; 
} 
} 
} 

注：
その中のJSONHelper.DataTableToJSON(dt) メソッドはDataTable解析成JSON，见另一篇文章JSONHelper帮助类