jQuery EasyUI DataGrid 分页 FOR ASP.NET

源代码：前台（html）：<!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" ...

weixin_30300523

46人浏览 · 2012-08-27 15:42:00

weixin_30300523 · 2012-08-27 15:42:00 发布

源代码：

前台（html）：

<!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" href="../jQuery/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="../jQuery/themes/icon.css" />
    <script type="text/javascript" src="../jQuery/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="../jQuery/jquery.easyui.min.js"></script>
 <script type="text/javascript" language="javascript">
        $(function(){
            $('#ReceiveList').datagrid({
                title:'收件箱',
                loadMsg:"正在加载，请稍等...", 
                striped: true,
                fit: true,//自动大小
                fitColumns: true,
                url:'../Common/DealData.ashx?Menu=Mail&MailFolder=Receive',//查看收件箱内容
                columns:[[
                    {field:'MailID',checkbox:true},
                    {field:'MailSender',title:'发件人',width:120,sortable:true,searchtype:"number"},
                    {field:'MailSendDate',title:'发件时间',width:120,sortable:true},
                    {field:'MailSubject',title:'标题',width:200,sortable:true
                ]],                
                rownumbers:true,//行号    
                singleSelect:false,//是否单选
                pagination:true//分页控件                 
   });
            //设置分页控件       
            var p = $('#ReceiveList').datagrid('getPager');       
            $(p).pagination({           
                pageSize: 10,//每页显示的记录条数，默认为10           
                pageList: [10,20,50],//可以设置每页记录条数的列表           
                beforePageText: '第',//页数文本框前显示的汉字           
                afterPageText: '页    共 {pages} 页',           
                displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录'                
            });
  });
 </script>
</head>
<body class="easyui-layout">
 <div region="center" title="列表" style="overflow:hidden;">
  <div id="main" class="easyui-tabs" fit="true" border="false">
   <div title="首页" style="padding:20px;overflow:hidden;"> 
    <div style="margin-top:20px;">
     首页
    </div>
   </div>
   <div title="收件箱" closable="true" selected="true" style="overflow:hidden;">
       <table id="ReceiveList"></table> 
   </div>
  </div>
 </div>
</body>
</html>

后台（DealData.ashx）：

using System;
using System.Collections;
using System.Data;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Collections.Generic;

namespace YM.Web.Common
{
    /// <summary>
    /// $codebehindclassname$ 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class DealData : IHttpHandler
    {
        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";

            //获取邮件信息，返回Json数据
            string strMailFolder = context.Request["MailFolder"];
            //rows和page是jQuery默认传的值（暂时还不知道怎么传的）
            int intPageSize = int.Parse(context.Request["rows"].ToString());
            int intCurrentPage = int.Parse(context.Request["page"].ToString());
            //分页属性
            YM.Model.PaginationCondition Pcondition = new YM.Model.PaginationCondition(intCurrentPage, intPageSize);
            string strJson = GetMailToJson(strMailFolder, Pcondition);
            context.Response.Write(strJson);
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }

        #region 获取邮件信息
        /// <summary>
        /// 获取邮件信息
        /// </summary>
        /// <param name="strMailFolder">邮件类型</param>
        /// <param name="Pcondition">分页属性</param>
        /// <returns>返回Json字符串</returns>
        public string GetMailToJson(string strMailFolder, YM.Model.PaginationCondition Pcondition)
        {
            string strResult = string.Empty;
            switch (strMailFolder)
            {
                case "Receive":
                    //收件箱
                    YM.BLL.MailBLL mailBLL = new YM.BLL.MailBLL();
                    YM.Model.Pagination<YM.Model.Mail> mailResult = mailBLL.GetList(Pcondition, "");
                    //将List转换为Json（这里要传“rows”，因为Jquery里面只认rows）
                    strResult = YM.Common.ConvertJson.ListToJson(mailResult.Results, mailResult.TotalCount, "rows");
                    break;
                default:
                    break;
            }
            return strResult;
        }
        #endregion
    }
}