easyui datagrid分页
datagrid分页设置 pagination="true" 貌似是不行的! 只是显示分页工具栏 没有达到分页效果
前端
$(function (){
var p = $('#dgVehicle').datagrid().datagrid('getPager');
p.pagination({
pageSize: 20,
pageList:[10,20,30,40,50],
beforePageText: '第',
afterPageText:'共{pages}页',
displayMsg: '当前显示 {from} 到 {to} ,共{total}记录'
//onBeforeRefresh: function () {
// alert('before refresh');
//},
//onRefresh: function (pageNumber, pageSize) {
// alert(pageNumber);
// alert(pageSize);
//},
//onChangePageSize: function () {
// alert('pagesize changed');
//},
//onSelectPage: function (pageNumber, pageSize) {
// alert(pageNumber);
// alert(pageSize);
//}
});
<div id="tb" style="padding: 2px; height: auto">
<div>
@*<a href="javascript:void(0)" onclick="cre('@Url.Action("VeCreate")')" class="easyui-linkbutton" iconcls="icon-add" plain="true">添加</a>*@
<a href="javascript:void(0)" onclick="mod('@Url.Action("VeEdit")')" class="easyui-linkbutton" iconcls="icon-edit" plain="true">修改</a>
<a href="javascript:void(0)" onclick="del('@Url.Action("VeDelete")')" class="easyui-linkbutton" iconcls="icon-remove" plain="true">删除</a>
<a id="btnSel" href="javascript:void(0)" onclick="sel()" class="easyui-linkbutton" iconcls="icon-search" plain="true">查询</a>
</div>
</div>
<table id="dgVehicle" class="easyui-datagrid" data-options="singleSelect:true,toolbar:'#tb',fit:true,fitColumns:true" title="车辆信息"
rownumbers="true" pagination="true" url="@Url.Action("VehicleData")"> <thead>
<tr>
<th data-options="field:'strVehicleModel'">
车辆型号
</th>
<th data-options="field:'strBatchNo'">
车辆批次
</th>
<th data-options="field:'strVIN'">
VIN码
</th> <th data-options="field:'strEngineModel'">
发动机型号
</th>
<th data-options="field:'strEngineNo'">
发动机编号
</th>
<th data-options="field:'strEngineMaker'">
发动机制造商
</th>
<th data-options="field:'strEngineLineage'">
发动机系族
</th>
<th data-options="field:'strEngineAddress'">
发动机生产厂地址
</th>
<th data-options="field:'strBrand'">
发动机厂牌
</th>
<th data-options="field:'strStatus'">
状态
</th>
</tr>
</thead>
</table>
前端通过get方式获得 json的数据 解析绑定到datagrid上 后端只用实现controller中的action就行
//这里的rows page是自动的 不用去写 直接获得就能得到当前的数据 rows是pagesize page是第几页
//只要代码写的没问题,easyui下面的分页插件中,比如选择每页显示多少行和上一页、下一页事件是自动触发的。
//page和rows也是esyui每次自动传到后台的,不需要自己手写 int rows = Request["rows"] == null ? : int.Parse(Request["rows"]);
int page = Request["page"] == null ? : int.Parse(Request["page"]);
List<VehicleModel> lst = new List<VehicleModel>();
var array = Fquery.ToArray();
for (int i = (page - ) * rows; i < page * rows && i < array.Length; i++)
{
lst.Add(array[i]);
} //最重要的是在后台取数据放在json中要添加个参数total来存放数据的总行数,如果没有这个参数则不能分页
int total = array.Length; var result = new { total = total, rows = lst }; return Json(result);
效果已出

easyui datagrid分页的更多相关文章
- EasyUI DataGrid分页数据绑定
记录东西感觉很痛苦,总结东西很痛苦,麻烦,不过为了下次的方便和知识的牢固以后要坚持总结. EasyUI DataGrid分页数据绑定 在解决方案中新建两个文件FormMain.aspx(html也可以 ...
- EasyUI datagrid 分页Json字符串格式
//EasyUI datagrid 分页Json字符串格式 //{"total":xx,"rows":[{...},{...}]} total:总数 rows: ...
- asp.net mvc easyui datagrid分页
提到 asp.net mvc 中的分页,很多是在用aspnetpager,和easyui datagrid结合的分页却不多,本文介绍的是利用easyui 中默认的分页控件,实现asp.net mvc分 ...
- easyUI datagrid 分页参数page和rows
Struts2获取easyUI datagrid 分页参数page和rows 用pageHelper分页时,只要是能够获取前台传来的两个参数page和rows基本就完成了很大一部分. 获取方法:定义两 ...
- EasyUI Datagrid 分页显示(客户端)
转自:https://blog.csdn.net/metal1/article/details/17536185 EasyUI Datagrid 分页显示(客户端) By ZYZ 在使用JQuery ...
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(8)-MVC与EasyUI DataGrid 分页
系列目录 前言 为了符合后面更新后的重构系统,文章于2016-11-1日重写 EasyUI Datagrid在加载的时候会提交一些分页的信息到后台,我们需要根据这些信息来进行数据分页再次返回到前台 实 ...
- easyui datagrid 分页略解
easyui datagrid 本身自带了分页功能. 但是这个需要你自己控制. 在后台可以得到两个datagrid的参数,rows 和page.其中rows是每页要显示的个数,page是第几页.单纯的 ...
- jquery easyui datagrid 分页详解
由于项目原因,用了jquery easyui 感觉界面不错,皮肤样式少点,可是官网最近打不开了,资料比较少,给的demo没有想要的效果,今天在用datagrid 做分页显示的时候,折腾了半天,网上的资 ...
- .Net Mvc EasyUI DataGrid 分页
由于项目的需要,最近一直在学习 .net MVC 和EasyUI.上周写了一个<.Net Mvc 返回Json,动态生成EasyUI Tree>,今天再写一个EasyUI中另一个重要的组件 ...
随机推荐
- Makefile常用信息查询页
这是博主第一次尝试在博客中使用markdown来写博文,目前感觉还不错.大家也可以尝试尝试. 符号说明 符号 作用 换行符 @ 放在命令前面隐藏命令输出 - 放在命令前面忽略命令错误 : 以来规则 ...
- Jquery 类似新浪微博,鼠标移到头像,用浮动窗口显示用户信息,已做成一个jquery插件
请注意!!!!! 该插件demo PHP 的 demo下载 C#.NET的demo下载 需要如下图, 1.鼠标移动到头像DIV时,Ajax获取数据,并让浮动DIV显示出来. 2.鼠标可以移动到上面浮 ...
- TFTP:简单文本传输协议,BOOTP:引导程序协议
TFTP:简单文本传输协议,BOOTP:引导程序协议 1.TFTP: TFTP(Trivial File Transfer Protocol,简单文件传输协议)是TCP/IP协议族中的一个用 ...
- CSS:CSS学习总结
CSS:CSS学习总结 背景 CSS是一种声明式的语言,学好CSS的难度甚至大于学好一门服务器语言(我个人的感觉),这周在学习CSS,就记录一下学习经验. 1.规则声明顺序 因为CSS的样式具备层叠性 ...
- ASP.NET MVC:多语言的三种技术处理策略
ASP.NET MVC:多语言的三种技术处理策略 背景 本文介绍了多语言的三种技术处理策略,每种策略对应一种场景,这三种场景是: 多语言资源信息只被.NET使用. 多语言资源信息只被Javascrip ...
- JAVA多线程经典问题 -- 生产者 消费者
工作2年多来一直也没有计划写自己的技术博客,最近辞职在家翻看<thingking in JAVA>,偶尔看到了生产者与消费者的一个经典的多线程同步问题.本人在工作中很少使用到多线程以及高并 ...
- Windows Store 手势编程小结
Windows Store 手势编程小结 最近完成了一个Windows Store上面的手势操作的页面.在这里总结了一下经验和心得,希望能和大家一起分享和讨论一下. 首先,要纠正一个误区,在Windo ...
- 搭建基于springmvc,ibatis的工程实现读写分离,配置分离
实现读写分离: 1.spring配置如下:spring-dataResource.xml <?xml version="1.0" encoding="UTF-8&q ...
- C#简单验证并限制登录次数小示例
描述:提示用户输入用户名,密码,与数据库中的数据匹配,如果正确则提示登陆成功,否则,提示登陆失败 错误次数超过三次,提示登陆次数过多,禁止登陆 数据表示例: //数据库中ErrorTimes的次数增加 ...
- ssi-uploader上传图片插件,点击选择文件按钮自动提交表单解决办法
先介绍一下这款插件,然后再谈使用中可能遇到的问题 ssi-uploader是一个JQuery的图片上传插件,界面比较美观 github地址:https://github.com/ssbeefeater ...