【第十篇】easyui-datagrid排序 (转)
本文体验datagrid的排序。
□ 思路
当点击datagrid的标题,视图传递给Controller的Form Data类似这样:page=1&rows=10&sort=CustomerID&order=asc。为了应对变化,把关于分页的封装成基类,其他关于排序或搜索的封装成继承该基类的子类。再把这些子类对象实例传递给服务层方法。
相关Model
//显示表相关
public class Customer
{
public int CustomerID { get; set; }
public string CompanyName { get; set; }
public string ContactName { get; set; }
public string ContactTitle { get; set; }
public string Address { get; set; }
public string City { get; set; }
public string Region { get; set; }
public string Country { get; set; }
public string Phone { get; set; }
public string Fax { get; set; }
} //关于分页封装成基类
public class PageParam { public int PageSize { get; set; }
public int PageIndex { get; set; }
} //关于搜索或排序封装成子类
public class CustomerParam : PageParam
{
public string SortProperty { get; set; }
public bool Order { get; set; }
}
服务层根据CustomerParam返回Customer集合,并返回一个输出总记录数
在进行分类的时候,用到了针对 IEnumerable<Customer>扩展方法OrderByWithDirection,如下:
using System.Linq;
namespace DataGridInMVC2.Helpers
{
public static class SortExtension
{
public static IOrderedEnumerable<TSource> OrderByWithDirection<TSource, TKey>(
this IEnumerable<TSource> source,
System.Func<TSource, TKey> keySelector,
bool descending)
{
return descending ? source.OrderByDescending(keySelector) : source.OrderBy(keySelector);
}
}
}
CustomerController
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using DataGridInMVC2.Helpers;
using DataGridInMVC2.Models; namespace DataGridInMVC2.Controllers
{
public class CustomerController : Controller
{
public ActionResult Index()
{
return View();
} public ActionResult GetData()
{
//接收datagrid传来的参数
//page=1&rows=10&sort=CustomerID&order=asc
int pageIndex = int.Parse(Request["page"]);
int pageSize = int.Parse(Request["rows"]);
string sortProperty = Request["sort"];
bool order = Request["order"] == "asc" ? false : true;
//构建服务类方法所需要的参数实例
var temp = new CustomerParam()
{
PageIndex = pageIndex,
PageSize = pageSize,
SortProperty = sortProperty,
Order = order
}; var service = new Service();
int totalNum = 0;
var customers = service.LoadPageCustomers(temp, out totalNum); var result = from customer in customers
select new
{
customer.CustomerID,
customer.CompanyName,
customer.ContactName,
customer.ContactTitle,
customer.Country,
customer.Region,
customer.Address,
customer.Fax,
customer.Phone,
customer.City
}; var jsonResult = new {total = totalNum, rows = result}; //序列化成json字符串
string str = JsonSerializeHelper.SerializeToJson(jsonResult);
return Content(str);
}
}
}
Customer/Index 视图
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
} <link href="~/Content/themes/default/easyui.css" rel="stylesheet" />
<link href="~/Content/themes/icon.css" rel="stylesheet" /> <table id="tt"></table> @section scripts
{
<script src="~/Scripts/jquery.easyui.min.js"></script>
<script src="~/Scripts/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
$(function () {
initData();
}); function initData(params) {
$('#tt').datagrid({
url: '@Url.Action("GetData","Customer")',
width: 730,
height: 400,
title: 'Customer列表',
fitColumns: true,
rownumbers: true, //是否加行号
pagination: true, //是否显式分页
pageSize: 15, //页容量,必须和pageList对应起来,否则会报错
pageNumber: 2, //默认显示第几页
pageList: [15, 30, 45],//分页中下拉选项的数值
columns: [[
//CustomerID,CompanyName,ContactName,ContactTitle,Country,Region,Address,Fax,Phone,City
{ field: 'CustomerID', title: '编号',sortable: true },
{ field: 'CompanyName', title: '客户名称', sortable: true },
{ field: 'ContactName', title: '联系人名称', sortable: true },
{ field: 'ContactTitle', title: '职位', sortable: true },
{ field: 'Address', title: '地址', sortable: true },
{ field: 'City', title: '城市名称', sortable: true },
{ field: 'Region', title: '区域' },
{ field: 'Country', title: '国家' },
{ field: 'Phone', title: '电话', sortable: true },
{ field: 'Fax', title: '传真', sortable: true }
]],
queryParams: params, //搜索json对象
sortName: 'CustomerID', //初始排序字段
sortOrder: 'asc' //初始排序方式
});
}
</script>
}
最终效果:
【第十篇】easyui-datagrid排序 (转)的更多相关文章
- easyUI datagrid 排序
easyUI datagrid 排序 1.首先设置datagrid属性sortName 2.设置sortOrder 3.设置remoteSort(注:此属性默认为true,如果如果是对本地数据排序必须 ...
- easyui datagrid client搜索、分页、排序
easyui datagrid的排序默认是server端排序.能够用sorter实现client排序[2].client分页可用filter实现[3].client搜索相同能够用filter实现. 不 ...
- easyui datagrid导出excel
[第十四篇]easyui datagrid导出excel <a class="btn btn-app" onclick="exportExcel()" ...
- easyui datagrid的列编辑
[第十五篇]easyui datagrid的列编辑,同时插入两张表的数据进去 看图说话. 需求:插入两张表,上面的表单是第一张表的内容,下面的两个表格是第二张详情表的内容,跟第一张表的id关联 第 ...
- 反射实体自动生成EasyUi DataGrid模板 第二版--附项目源码
之前写过一篇文章,地址 http://www.cnblogs.com/Bond/p/3469798.html 大概说了下怎么通过反射来自动生成对应EasyUi datagrid的模板,然后贴了很多 ...
- DataTables VS EasyUI DataGrid 基础应用 转
DataTables中文网推出了 第一篇 关于DataTables和其他表格插件比较后,为了把让这个比较更有意义,更能帮助到大家,DataTables中文网 做了问卷调查,根据小伙伴们的填写我归纳了一 ...
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(8)-MVC与EasyUI DataGrid 分页
系列目录 前言 为了符合后面更新后的重构系统,文章于2016-11-1日重写 EasyUI Datagrid在加载的时候会提交一些分页的信息到后台,我们需要根据这些信息来进行数据分页再次返回到前台 实 ...
- jquery easyui datagrid翻页后再查询始终从第一页开始
在查询之前将datagrid的属性pageNumber重新设置为1 var opts = grid.datagrid('options'); opts.pageNumber = 1; easyui d ...
- EasyUI datagrid优化
easyui datagrid 在IE上加载速度慢, 150行数据就无法忍受了. firefox加载速度还可以. jquery easyui datagrid使用参考 http://www.cnblo ...
随机推荐
- 单纯的xlistview
public class MainActivity extends AppCompatActivity implements XListView.IXListViewListener{ private ...
- c#小灶——常量、变量和赋值
常量 常量很好理解,和变量相对,就是不会变的量.比如,1就是常量,3.6也是常量,‘a’也是常量,“aaaaa”也是常量,只是不同类型.这些都是表面上一眼就看出来的常量,还有一种表面上看不出来的常量, ...
- cs231n---语义分割 物体定位 物体检测 物体分割
1 语义分割 语义分割是对图像中每个像素作分类,不区分物体,只关心像素.如下: (1)完全的卷积网络架构 处理语义分割问题可以使用下面的模型: 其中我们经过多个卷积层处理,最终输出体的维度是C*H*W ...
- mysql 输入show databases 没反应
我是小白,大佬勿喷 *** mysql 输入show databases 没反应 一句话 不要忘记使用MySQL时在命令后加;哦 * * * 在Linux输入以下命令 mysql 终端显示以下文本 W ...
- SpringBoot 缓存模块
默认的缓存配置 在诸多的缓存自动配置类中, SpringBoot默认装配的是SimpleCacheConfigguration, 他使用的CacheManager是 CurrentMapCacheMa ...
- git 常规业务场景 使用
一般每个开发者都会有个自己的分支,有个test分支,合并代码用,两条分支相互备份,就算merge的时候被覆盖,也不用担心 建立自己的分支 // 创建本地分支, git checkout -b dev_ ...
- 关于Python虚拟环境与包管理你应该知道的事
关于我 一个有思想的程序猿,终身学习实践者,目前在一个创业团队任team lead,技术栈涉及Android.Python.Java和Go,这个也是我们团队的主要技术栈. Github:https:/ ...
- net必问的面试题系列之基本概念和语法
上个月离职了,这几天整理了一些常见的面试题,整理成一个系列给大家分享一下,机会是给有准备的人,面试造火箭,工作拧螺丝,不慌,共勉. 1.net必问的面试题系列之基本概念和语法 2.net必问的面试题系 ...
- Log4j2源码分析系列:(一)配置加载
前言 在实际开发项目中,日志永远是一个绕不开的话题.本系列文章试图以slf4j和log4j2日志体系为例,从源码角度分析日志工作原理. 学习日志框架,首先要熟悉各类日志框架,这里推荐两篇文章,就不再赘 ...
- Redis学习总结(九)-- Redis常用技巧
这里会记录下Redis 常用的小技巧 全局使用 redis-cli 等命令 在之前我们都在做 Redis 命令目录下通过 ./redis-cli这种形式访问,如果使用 redis-cli 的话就会报命 ...