前台页面
html
<table id="dg"> </table>
JavaScript
$("#dg").datagrid({
500,
//自适应列内容
fitColumns: true,
//只允许选择一行
singleSelect: true,
//显示分页栏
pagination: true,
//显示行号
rownumbers:true,
//初始化的页码
pageNumber: 1,
//初始化的页容量
pageSize: 5,
//初始化页面大小选择列表
pageList: [5, 10, 15, 20],
//指明哪一个字段是标识字段
idField: 'PositionCode',
//在从远程站点加载数据的时候显示提示消息
loadMsg:'正在获取数据中。。。',
//获取后台json数据
url: '/Position/GetPositionJsonData',
//列对象数组,该对象必须数组
columns: [[
{
field: 'ck',
checkbox: true,
},
{
field: 'PositionCode',
title:'岗位编号'
},
{
field: 'PositionName',
title: '岗位名称'
},
{
field: 'Remark',
title: '备注'
},
{
field: 'IsForbid',
title: '是否禁用'
}
]],
});
asp.net mvc后台
/// <summary> /// 获取分页数据 /// </summary> /// <returns></returns> public ActionResult GetPositionJsonData() { //初始化页码 int page = 1; //初始化页容量 int rows = 5; //根据前台请求:获取请求的页码,页容量 if (Request["page"]!=null) { page = Convert.ToInt32(Request["page"]); } if (Request["rows"] != null) { rows = Convert.ToInt32(Request["rows"]); } DAL.SYS_Position positionDAL = new DAL.SYS_Position(); DataSet ds = positionDAL.GetListByPage2("", "PositionCode desc", page, rows); List<Model.SYS_Position> list = new List<SYS_Position>(); Model.SYS_Position p = null; for (int i = 0; i < ds.Tables[0].Rows.Count; i++) { p = new SYS_Position(); p.PositionCode = ds.Tables[0].Rows[i]["PositionCode"].ToString(); p.PositionName = ds.Tables[0].Rows[i]["PositionName"].ToString(); p.Remark = ds.Tables[0].Rows[i]["Remark"].ToString(); p.IsForbid = ds.Tables[0].Rows[i]["IsForbid"].ToString(); list.Add(p); } //由于DataGrid请求的数据必须是json对象的数据,而且格式必须是 {totoal=总数,rows=数据对象},所以下面对数据进行了加工 var result = new { total = positionDAL.GetRecordCount(""), rows = list }; //返回需要的json格式的数据 return Json(result, JsonRequestBehavior.AllowGet); }
特别要强调的是返回的json格式:{totoal=总数,rows=数据对象},并且数据对象是数组形式。
比如:
{"total":12,"rows":[{"PositionCode":"1012","PositionName":"监控中心","Remark":"","IsForbid":"1"},{"PositionCode"
:"1011","PositionName":"准运卡售卡员","Remark":"","IsForbid":"1"},{"PositionCode":"1010","PositionName":"财
务股股长","Remark":"","IsForbid":"1"},{"PositionCode":"1009","PositionName":"计量站副站长","Remark":"","IsForbid"
:"1"},{"PositionCode":"1008","PositionName":"计量站站长","Remark":"","IsForbid":"0"},{"PositionCode":"1007"
,"PositionName":"监控室主任","Remark":"","IsForbid":"1"},{"PositionCode":"1006","PositionName":"磅秤监控","Remark"
:"","IsForbid":"1"},{"PositionCode":"1005","PositionName":"计量站司磅员","Remark":"","IsForbid":"0"},{"PositionCode"
:"1004","PositionName":"监控员","Remark":"调运监控室上班人员","IsForbid":"0"},{"PositionCode":"1003","PositionName"
:"标识卡售卡员","Remark":"售卡人员","IsForbid":"1"}]}