easyui datagrid 分页

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<script src="~/jquery-easyui-1.4.2/locale/easyui-lang-zh_CN.js"></script>
<table id="datagrid" class="easyui-datagrid" title="" style="width: 100%;"
    data-options="rownumbers:true,autoRowHeight:false,pagination:true,toolbar:'#tb',footer:'#ft',fit:true,
                pageSize:50,singleSelect:true,collapsible:true,url:'@Url.Action("Index")',method:'post',fixed:true,
    
    remoteSort:false,
                multiSort:true">
    <thead>
        <tr>
            <th data-options="field:'Id',checkbox:true"></th>
            <th data-options="field:'LoginAccount'">登陆账号</th>
            <th data-options="field:'ShopName'">名称</th>
        </tr>
    </thead>
</table>
<div id="tb" style="padding: 2px 5px;">
    <a href="#" class="easyui-linkbutton" iconcls="icon-add" plain="true">增加</a>
    <a href="#" class="easyui-linkbutton" iconcls="icon-edit" plain="true">修改</a>
    <a href="#" class="easyui-linkbutton" iconcls="icon-cancel" plain="true">删除</a>
    <a href="#" class="easyui-linkbutton" iconcls="icon-xls" plain="true">导出Excel</a>

    <select onchange="$('#datagrid').datagrid({singleSelect:(this.value==0)})">
        <option value="0">选中单行</option>
        <option value="1">选中多行</option>
    </select>
    <input class="easyui-textbox" id="LoginAccount" value="" name="LoginAccount" data-options="prompt:'账号:'" style="height: 22px; width: 120px">
    <input class="easyui-textbox" id="ShopName" value="" name="ShopName" data-options="prompt:'名称:'" style="height: 22px; width: 120px">

    <a href="#" class="easyui-linkbutton" onclick="doSearch()" iconcls="icon-search">查询</a>
    <div id="w" class="easyui-window" title="Modal Window" data-options="modal:true,closed:true" style="padding: 10px;">
    </div>
</div>

<script>
    var UrlActionToExcel = "@Url.Action("ToExcel")";
</script>

 

提供2中 方法

 

  [HttpPost]
        [ActionName("Index")]
        public string Index_Search(TraderInfo model, int page, int rows)
        {
            var obj = new KT_Product_Show_Market.Models.DataGridJson();  //创建EasyUI DataGrid 所需格式对象
            int pageNum = page;         //返回第几页
            int RowsNum = rows;         //返回行数
            var All = GetAll(model);    //得到  查询 所有 数据 集的 Iqueryable 
            obj.total = All.Count();    //总行数
            obj.rows = All.OrderBy(X => X.Id).Skip((page - 1) * rows).Take(rows).ToList();     //获当前页数据集

            return JsonConvert.SerializeObject(obj, Formatting.Indented, new JsonSerializerSettings() { DateFormatHandling = 0 });
        }

        [HttpPost]
        [ActionName("Index")]
        public JsonResult List(TraderInfo model, int page, int rows)
        {
            var All = GetAll(model);
            Dictionary<string, object> json = new Dictionary<string, object>();
            json.Add("total", All.Count());
            json.Add("rows", All.OrderBy(X => X.Id).Skip((page - 1) * rows).Take(rows).ToList());
            return Json(json);

        }

第一中 需要 再写一个类

namespace KT_Product_Show_Market.Models
{
    public class DataGridJson
    {
        public int total { get; set; }    //记录的总条数
        public object rows { get; set; }  //具体内容
    }
}

前台调用

 

posted @ 2015-04-27 09:57  pengbg  阅读(426)  评论(0编辑  收藏  举报