代碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>評論管理</title>
<!-- 引入主題文件 -->
<link rel="stylesheet" type="text/css" media="screen" href="../themes/redmond/jquery-ui-1.8.4.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="../themes/ui.jqgrid.css" />
<!-- 引入腳本文件 -->
<script type="text/javascript" src="../scripts/jQuery/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="../scripts/jQuery/plugins/jquery-ui-1.8.4.custom.min.js"></script>
<script type="text/javascript" src="../scripts/jQuery/plugins/grid.locale-cn.js"></script>
<script type="text/javascript" src="../scripts/jQuery/plugins/jquery.jqGrid.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
jQuery("#list").jqGrid({
url: 'asynchronous/GridData.ashx?p=Comment',
datatype: "json",
height: 'auto',
colNames: ['評論ID', '類別ID', '文章ID', '留言人', '留言內容', '發佈日期', '留言IP'],
colModel: [
{ name: 'CommentID', index: 'CommentID', sorttype: "int", width: 60 },
{ name: 'TypeID', index: 'TypeID', sorttype: "int", width: 60 },
{ name: 'FromID', index: 'FromID', sorttype: "int", width: 60 },
{ name: 'Name', index: 'Name', editable: true, width: 60 },
{ name: 'Contents', index: 'Contents', sortable: false, width: 300 },
{ name: 'PublishDate', index: 'PublishDate', sorttype: "date", width: 190 },
{ name: 'IP', index: 'IP', align: "right", sorttype: "float", editable: true, width: 130 }
],
viewrecords: true,
rowNum: 10,
rowList: [10, 20, 30],
sortname: 'CommentID',
jsonReader: {
root: "griddata",
total: "totalpages",
page: "currpage",
records: "totalrecords",
repeatitems: false
},
pager: "#pager",
caption: "評論管理",
sortorder: "desc",
hidegrid: false
});
jQuery("#list").jqGrid('navGrid', '#pager', { edit: false, add: false, del: false });
});
</script>
</head>
<body>
<form id="frmMComment" runat="server">
<div>
<table id="list" class="scroll" cellpadding="0" cellspacing="0"><!--用於數據顯示-->
</table>
<div id="pager" class="scroll" style="text-align: center;"><!--用於分頁的層-->
</div>
</div>
</form>
</body>
</html>
客戶端的完整代碼是這樣的,注意,在下面的body部分有兩個層,分別是綁定GRID和綁定PAGER用的哦!
3.handler.ashx的處理
關鍵應該就是這個東西了,我直接貼重要代碼,大家直接粘貼進去就好了,這裏的算法是根據官網的PHP改過來的,可能不是很嚴謹,或者有什麼bug,歡迎大家指正或者幫忙想出更好的算法.
代碼
<%@ WebHandler Language="C#" Class="GridData" %>
using System;
using System.Web;
using System.Data;
using Wood8.Common;
using Wood8.DataAccess.SQLServer;
using Newtonsoft.Json;
using Newtonsoft.Json.Converters;
using System.Web.Services;
using System.Collections;
using System.Collections.Generic;
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class GridData : IHttpHandler {
public void ProcessRequest(HttpContext context)
{
context.Response.Buffer = true;
context.Response.ExpiresAbsolute = DateTime.Now.AddDays(-1);
context.Response.AddHeader("pragma", "no-cache");
context.Response.AddHeader("cache-control", "");
context.Response.CacheControl = "no-cache";
context.Response.ContentType = "text/plain";
DataTable dt;
string jsonData=string.Empty;
string sPage = HttpContext.Current.Request.Params["page"].ToString(); //當前請求第幾頁
int iPage = int.Parse(sPage);
string sLimit = HttpContext.Current.Request.Params["rows"].ToString(); //grid需要顯示幾行
int iLimit = int.Parse(sLimit);
string sSidx = HttpContext.Current.Request.Params["sidx"].ToString(); //按什麼排序
string sSord = HttpContext.Current.Request.Params["sord"].ToString(); //排序方式('desc'/'asc')
if(sSidx=="")
{
sSidx ="1";
}
int iTotalpages;
SQLComment sc = new SQLComment();
DataSet sResult = sc.getAllComments();
int iCount = sResult.Tables[0].Rows.Count;
if( iCount >0 )
{
int iR = iCount/iLimit;
iTotalpages = iR + 1;
}
else
{
iTotalpages = 0;
}
if (iPage > iTotalpages)
{
iPage = iTotalpages;
}
int iStart = iLimit * iPage - iLimit + 1; // do not put iLimit*(iPage - 1)
iLimit = iLimit * iPage;
sResult = sc.getCommentsFromTo(iStart, iLimit, sSidx, sSord, iPage);
dt = sResult.Tables[0];
string totalpages = iTotalpages.ToString();
string currpage = iPage.ToString();
string totalrecords = iCount.ToString();
IsoDateTimeConverter idtc = new IsoDateTimeConverter();
idtc.DateTimeFormat = "yyyy-MM-dd hh:mm:ss ffffff";
jsonData = JsonConvert.SerializeObject(dt, idtc).ToString();
string returnData = string.Empty;
returnData = "{";
//總共多少頁
returnData += "\"totalpages\"";
returnData += ":";
returnData += "\"";
returnData += totalpages;
returnData += "\"";
returnData += ",";
//當前第幾頁
returnData += "\"currpage\"";
returnData += ":";
returnData += "\"";
returnData += currpage;
returnData += "\"";
returnData += ",";
//總共多少記錄
returnData += "\"totalrecords\"";
returnData += ":";
returnData += "\"";
returnData += totalrecords;
returnData += "\"";
returnData += ",";
//datable轉換得到的JSON字符串
returnData += "\"griddata\"";
returnData += ":";
returnData += jsonData;
returnData += "}";
context.Response.Write(returnData);
}
public bool IsReusable {
get {
return false;
}
}
}