jquery easyUI DataGrid 初始化的时候就显示可排序的字段
在使用easy ui的列表中,想要标记可以排序的字段,使用户一看页面就知道哪些是可以点击排序的。
给可排序的字段添加
图标在列名后面。不可排序的字段还和原来一样。
步骤:
你需要一个图标
,你需要给你的easy ui源码添加如下代码
$("span",td).html(col.title);
$("span.datagrid-sort-icon",td).html(" ");
var cell=td.find("div.datagrid-cell");
if (opts.sortName == col.field) {
cell.addClass("datagrid-sort-" + opts.sortOrder);
} else if(col.sortable==true) {
cell.addClass("datagrid-sort");
}其中最后一个else if部分为手动添加的。
最后,给你的项目添加应用css即可
.datagrid-sort .datagrid-sort-icon {
padding: 0 13px 0 0;
margin-left:4px;
background: url('images/sorter.png') no-repeat 0px center;
}
.datagrid-sort-asc .datagrid-sort-icon,.datagrid-sort-desc .datagrid-sort-icon {
margin-left:0px;
}备注:图片可自由选用,其次,样式名字可自由选用(“datagrid-sort”为我自定义的),最后,我的easy ui是压缩版1.3.2的,搜索“datagrid-sort-icon”可找到对应代码部分,找到
if (opts.sortName == col.field) {
cell.addClass("datagrid-sort-" + opts.sortOrder);
}给这个if语句添加分支else if(col.sortable==true) {
cell.addClass("datagrid-sort");
}最后上一张效果图

jquery easyUI DataGrid 初始化的时候就显示可排序的字段的更多相关文章
- jquery easyui datagrid 将值作为img显示图片时报404 undefined
原因:datagrid 在请求到数据先进行头部数据和样式的渲染,之后数据 obj = {} value = undefined index = 0 进行一次渲染, 在没有formater情况将数据 ...
- jquery easyui DataGrid 动态的改变列显示的顺序
$.extend($.fn.datagrid.methods,{ columnMoving: function(jq){ return jq.each(function(){ var target = ...
- jquery easyui datagrid使用参考
jquery easyui datagrid使用参考 创建datagrid 在页面上添加一个div或table标签,然后用jquery获取这个标签,并初始化一个datagrid.代码如下: 页面上 ...
- jquery easyui datagrid 分页 详解
前些天用jquery easyui的table easyui-datagrid做分页显示的时候,折腾了很久,后来终于解决了.其实不难,最主要我不是很熟悉前端的东西. table easyui-data ...
- 扩充 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- 扩展jquery easyui datagrid编辑单元格
扩展jquery easyui datagrid编辑单元格 1.随便聊聊 这段时间由于工作上的业务需求,对jquery easyui比较感兴趣,根据比较浅薄的js知识,对jquery easyui中的 ...
- JQuery easyUi datagrid 中 editor 动态设置最大值最小值
前言 近来项目中使用到 easyui 来进行页面设计,感觉挺方便的,但是网上除了api外,其他有价值的资料比较少,故在此分享一点经验,供大家参考. 问题 JQuery easyUi datagri ...
- JQuery easyUi datagrid 中 自定义editor作为列表操作按钮列
转自 http://blog.csdn.net/tianlincao/article/details/7494467 前言 JQuery easyUi datagrid 中 使用datagrid生 ...
随机推荐
- 原生的UITableViewCell高度自适应,textLabel自动换行显示
/* * 设置子项cell **/ - (UITableViewCell *)getChildCell:(UITableView *)tableView and:(NSIndexPath *)inde ...
- Java 面向对象(转)
转自:http://blog.sina.com.cn/s/blog_83c5190f01010ate.html 1.我们可以把JAVA中的类分为以下三种: 类:使用class定义且不含有抽象方法的类. ...
- HDU 5724 - Chess
题意: 一个n行20列的棋盘. 每一行有若干个棋子. 两人轮流操作, 每人每次可以将一个棋子向右移动一个位置, 如果它右边有一个棋子, 就跳过这个棋子, 如果有若干个棋子, 就将这若干个 ...
- 给小班讲stl 之 map、sort、优先队列
引子:最近老师让给小班讲课,讲stl,,但是我觉得就小班现在这水平根本讲不懂好不好,,,,
- 使用pymysql连接MySql数据库
MySQLdb安装失败了,直接使用pymysql,安装了pymysql. 并学习了使用使用pymysql创建数据库和表,并插入数据. __author__ = 'Administrator' impo ...
- API例子:用Python驱动Firefox采集网页数据
1,引言 本文讲解怎样用Python驱动Firefox浏览器写一个简易的网页数据采集器.开源Python即时网络爬虫项目将与Scrapy(基于twisted的异步网络框架)集成,所以本例将使用Scra ...
- D、GO、Rust 谁会在未来取代 C?为什么?——Go语言的定位非常好,Rust语言非常优秀,D语言也不错
不要管我的地位和 D 语言创造者之一的身份.我会坦诚的回答这个问题.我熟悉 Go 和 Rust,并且知道 D 的缺点在哪里.我鼓励人们在 Rust 和 Go 社区相似身份的人,也可以提出他们诚恳的观点 ...
- MFC 操作控件数据
在MFC中有多种获取控件数据的方法 1.GetWindowText()和SetWindowText()函数 ],ch2[],ch3[]; GetDlgItem(IDC_EDIT1)->Get ...
- JTextPane 的 undo 、 redo
实现文本框输入内容的单条记录撤销,重做,通过按钮实现 以及通过JList的多条撤销.重做操作(类似PS) 昨天还在为自己写不出代码怎么办而伤心,没想到今天上午就实现了,并且还完善了功能: 可以在撤销一 ...
- Activity和View的区别:
Activity和View的区别: activity相当于控制部分,view相当于显示部分.两者之间是多对多的关系,所有东西必须用view来显示. viewGroup继承自view,实现了ViewM ...