JQuery EasyUI-DataGrid用法示例
本文导语: 1,显示列表.aspx 代码示例: 显示列表_www. $(function () { $("#cc").layout(); }) ...
1,显示列表.aspx
显示列表_www.
$(function () {
$("#cc").layout();
})
2,UserManager.htm
$(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("");
}
3,后台一般处理程序UserManager.ashx
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Serialization;
using System.Data;
namespace MyStartEasyUi.ashx
{
///
/// UserManager 的摘要说明
///
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 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;
}
}
}
}