博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
easyui datagrid 初始化排序按钮不显示的问题
阅读量:7091 次
发布时间:2019-06-28

本文共 1104 字,大约阅读时间需要 3 分钟。

hot3.png

说明:

使用easyui datagrid时,如果需要设置某一列点击可排序,即sortable属性,datagrid初始化加载时,排序按钮会不显示,这样用户则不知道哪列可排。下面代码解决这个问题。

情况一:仍使用easyui原有图片

步骤一:找到easyui引用文件的源码,如下文件。

184901_iI3V_2829989.png

步骤二:修改源码:搜索“datagrid-sort-icon”,添加如下红框内的代码,即

else if(col.sortable == true){

    cell.addClass("datagrid-sort");

}

185408_CJ28_2829989.png

步骤三:修改页面中的css样式

.datagrid-sort .datagrid-sort-icon {     padding: 0 13px 0 0;     margin-left:4px;     background: url('../easyui/themes/default/images/datagrid_icons.png') no-repeat -16px center; }.datagrid-sort-desc .datagrid-sort-icon {    padding: 0 13px 0 0;    background: url('../easyui/themes/default/images/datagrid_icons.png') no-repeat -16px center;}.datagrid-sort-asc .datagrid-sort-icon {    padding: 0 13px 0 0;    background: url('../easyui/themes/default/images/datagrid_icons.png') no-repeat 0px center;}

 

完成效果图:

190153_iF76_2829989.png

情况二:使用自定义图片

仅步骤三不同:需提前准备按钮图片sorter.png

.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;}

 

转载于:https://my.oschina.net/jingyao/blog/820176

你可能感兴趣的文章
手势的状态判断,
查看>>
单例(LintCode)
查看>>
女孩子,不漂亮也没关系
查看>>
Srpingboot controller service模板实现
查看>>
Helllo World
查看>>
ZJOI2007报表统计·BZOJ1058
查看>>
页面加载时序问题----BUG分析
查看>>
[算法题] 汉诺塔问题
查看>>
几何,求两整数点确定的线段上的整数点的个数
查看>>
【算法导论】学习笔记——第10章 基本数据结构
查看>>
BNUOJ52317 As Easy As Possible(树上倍增)
查看>>
STL源码阅读(一)
查看>>
c-28
查看>>
华为交换机重置密码案例
查看>>
17素材下载地址
查看>>
Jquery EasyUI1.3.1 JS加载出错
查看>>
LA 4794 Sharing Chocolate (搜索)
查看>>
Yahoo团队网站性能优化的35条黄金守则
查看>>
secureCrt Linux 文件传输
查看>>
JaveWeb 公司项目(1)----- 使Div覆盖另一个Div完成切换效果
查看>>