<html>
<head> <title></title> <script src="/jquery-easyui-1.3.4/jquery-1.8.0.min.js" type="text/javascript"></script> <script src="/jquery-easyui-1.3.4/jquery.easyui.min.js" type="text/javascript"></script> <script src="/jquery-easyui-1.3.4/locale/easyui-lang-zh_CN.js" type="text/javascript"></script> <link href="/jquery-easyui-1.3.4/themes/icon.css" rel="stylesheet" type="text/css" /> <link href="/jquery-easyui-1.3.4/themes/default/easyui.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $(function () { $("#cc").layout(); }) </script></head><body> <div id="cc" fit="true"> <div data-options="region:'north',title:'North Title',split:true" style="height: 100px;"> </div> <div data-options="region:'south',title:'South Title',split:true" style="height: 100px;"> </div> <div data-options="region:'west',title:'West',split:true" style="width: 100px;"> </div> <div data-options="region:'center',title:'我是中间面板'" style="overflow:hidden;" href='/tabs/tabChild/UserManager.htm'> </div> </div></body></html>-------------------UserManager.html-------------------<script type="text/javascript"> $(function () { $("#divLayout").layout(); $("#tblUserList").datagrid({ url: '/ashx/UserManager.ashx', title: '', loadMsg: '数据加载中,请稍候...', nowrap: false, pageSize: 10, pageList: [10, 20, 30], columns: [[ //注意要两个嵌套的中括号 { field: 'Id', title: '编号', width: 120, align: 'center', sortable: true }, { field: 'LoginId', title: '用户ID', width: 120, align: 'left', sortable: true }, { field: 'Name', title: '用户名称', width: 120, align: 'left', sortable: true }, { field: 'Address', title: '用户地址', width: 120, align: 'left', sortable: true } ]], fitColumns: true, singleSelect: true, pagination: true, sortOrder: "asc", sortName: "Id", //初始化时按Id升序排序 toolbar: [{ iconCls: 'icon-add', text: '添加', handler: function () { alert('Add') } }, '-', { //分隔符 iconCls: 'icon-edit', text: '编辑', handler: function () { alert('edit') } }, '-', { iconCls: 'icon-remove', text: '删除', handler: function () { alert('delete') } }, '-', { iconCls: 'icon-search', text: '查询', handler: function () { alert('search') } }] }); }); //按用户自定义查询条件查询,调用datagird的load方法,传递name查询条件 function QueryData() { $("#tblUserList").datagrid("load", { "name":$("#tblQuery").find("input[name='txtName']").val() }); } //清除查询条件 function ClearQuery() { $("#tblQuery").find("input").val(""); }</script><div id="tt" class="easyui-tabs" fit="true" border="false"> <div title="用户管理"> <div id="divLayout" fit="true"> <div data-options="region:'north',split:false" style="height: 60px;padding-top:6px;" border="false"> <!--高级查询部分--> <table id="tblQuery" border="0" cellspacing="0" cellpadding="0" width="100%"> <tr> <th> 用户名: </th> <td> <input name="txtName" /> </td> </tr> <tr> <th> 注册时间: </th> <td> <input name="txtRegStartTimeStart" class="easyui-datetimebox" editable="false" /> 至 <input name="txtRegStartTimeEnd" class="easyui-datetimebox" editable="false" /> <a class="easyui-linkbutton" data-options="iconCls:'icon-search'" src="javascript:void(0)" οnclick="QueryData()" plain="true">查询</a> <a class="easyui-linkbutton" data-options="iconCls:'icon-remove'" src="javascript:void(0)" οnclick="ClearQuery()" plain="true">清空</a> </td> </tr> </table> </div> <div data-options="region:'center',split:false" border="false"> <!--显示数据列表部分--> <table id="tblUserList" fit="true"> </table> </div> </div> </div></div>---------------------后台一般处理程序UserManager---------------------------using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.Script.Serialization;using System.Data;namespace MyStartEasyUi.ashx{ /// <summary> /// UserManager 的摘要说明 /// </summary> public class UserManager : IHttpHandler { UsersExtendBll bll = new UsersExtendBll(); public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; int pageIndex = GetPageIndex(context); int pageSize= GetPageSize(context); string mySort = GetSort(context) + " " + GetOrder(context); string queryName = GetQueryName(context); string whereStr = ""; if (!string.IsNullOrEmpty(queryName)) { whereStr += " name like '%" + queryName + "%'"; } DataSet dsGet = bll.GetListByPage(whereStr, mySort, (pageIndex - 1) * pageSize + 1, pageIndex * pageSize); List<MyBookShop.Model.Users> lst = bll.DataTableToList(dsGet.Tables[0]); int total = bll.GetRecordCount(""); JavaScriptSerializer js = new JavaScriptSerializer(); string jsonStrings = js.Serialize(lst); string returnJson = "{\"total\":"+ total.ToString() + ",\"rows\":" + jsonStrings +"}"; //返回Json格式total表示总数,rows表示返回的数据,这样返回才能分页 System.Threading.Thread.Sleep(2000); context.Response.Write(returnJson); } public bool IsReusable { get { return false; } } public Int32 GetPageSize(HttpContext context) { try { return Int32.Parse(context.Request["rows"].ToString()); } catch { return 10; } } public string GetOrder(HttpContext context) { return context.Request.Form["order"]; } public string GetSort(HttpContext context) { return context.Request.Form["sort"]; } public string GetQueryName(HttpContext context) { return context.Request.Form["name"]; } public Int32 GetPageIndex(HttpContext context) { try { return Int32.Parse(context.Request["page"].ToString()); } catch { return 1; } } }}