背景:

    昨天帮朋友做一个easyui datagrid的小实例时,才发现easyui datagrid的checkbox列,没有根据值为true或false来选中checkbox,当时感觉太让人失望了,这样的问题就没有解决,太不人性化了。因为从去年到今年一直用的是miniui,所以用起来就会有对比了,easyui和miniui各个方便相比差的太远了,也有可能是miniui是商业的吧!

  记录下来解决方法,以便日后用的时候方便查找,如果有更好方法请留言,互相学习学习!

问题:

  先上个几个图片让大家有一个直观的印象

easyui datagrid表格的列配置内容

json数据

datagrid显示的效果

   就是一个简单的datagrid,有一个checkbox列,问题就出在checkbox列,当加载数据时checkbox列的值有的给的是true,但是给true的checkbox却没有被选中,这就是问题的所在,相信大家从图片中也能看出,现在前端UI很多,但大多数的datagrid应该实现了这个功能。

解决方法:

方法一:在onLoadSuccess事件中处理

代码如下:

        function onLoadSuccess(data) {
var rowData = data.rows;
$.each(rowData, function (idx, val) {
if (val.ck) {
$("#dg").datagrid("selectRow", idx);
}
});
}

此方法是从网上找的,但是感觉不是很好,而且数据多了,效率肯定不行了,所以就有了方法二。

方法二:修改easyui源代码

跟踪源代码最后找到了要修改的地方,主要修改renderRow方法中的checkbox分支

源代码如下:

                    if (col.checkbox) {
cc.push("<input type=\"checkbox\" name=\"" + _69e + "\" value=\"" + (_69f != undefined ? _69f : "") + "\">");
}

 仔细一看发现的的确确,没有实现此功能,其实很简单,改一下当_69f为true的时候加上checked="checked"的属性即可(注意:我改的是1.3.5的源代码)。

改后的代码如下:

                    if (col.checkbox) {
//<input type="checkbox" value="true" checked="checked"/>
cc.push("<input type=\"checkbox\" name=\"" + _69e + "\" value=\"" + (_69f != undefined ? _69f : "") + "\"" + (_69f ? "checked=\"checked\"" : "") + "\"/>");
}

成果:

上一个简单的图片来看一下

解决easyui datagrid加载数据时,checkbox列没有根据checkbox的值来确定是否选中的更多相关文章

  1. Easyui datagrid加载数据时默认全选的问题

    问题描述: 最近使用 Easyui datagrid 展示数据,之前一直使用很正常,今天出现了一个怪异问题 加载数据后,只要点击选中列 ck 的任意行或多行,再刷新时整个datagrid的所有数据都 ...

  2. easyui datagrid加载数据的三种方式

    1.加载本地数据 var obj = {"total":2,"rows":[{id:"1",name:"一"},{id: ...

  3. easyui datagrid加载数据的两种方式

    1.加载本地数据 var obj = {"total":2,"rows":[{id:"1",name:"一"},{id: ...

  4. easyui datagrid加载数据和分页

    <%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding=& ...

  5. Java MiniUi datagrid加载数据时,如果使用virtualScroll="false",数据多一点可能就会加载不出来

    datagrid的值为 virtualScroll="true" 问题解决.

  6. easyui datagrid 异步加载数据时滚动条有时会自动滚到最底部的问题

    在使用easyui 的datagrid异步加载数据时发现滚动条有时会自动滚到最底部.经测试发现,如果加载数据前没有选中行则不会出现这个问题.这样我们可以在重新异步加载数据前取消选中行就可以避免这个问题 ...

  7. 实现easyui datagrid在没有数据时显示相关提示内容

    本示例实现easyui datagrid加载/查询数据时,如果没有相关记录,则在datagrid中显示没有相关记录的提示信息,效果如下图所示 本实例要实现如下图所示的效果: 本示例easyui版本为1 ...

  8. jquery easyui使用(三)······datagrid加载数据(已解决)

    <div id="table_Data"> </div> $("#table_Data").datagrid({ toolbar: '# ...

  9. ListView用法及加载数据时的闪烁问题和加载数据过慢问题

    ListView介绍及添加数据时的闪烁问题 1.     ListView类 1.1 ListView常用的基本属性: (1)FullRowSelect:设置是否行选择模式.(默认为false) 提示 ...

随机推荐

  1. 软硬大比拼 硅胶、TPU和PC材质对比

    手机保护壳的材质有很多种,目前保护壳市场上最为常见的就是硅胶.TPU.PC材质了.那么我们不禁要问,PU.硅胶.PC三材质到底有哪些区别呢?普通消费者在购买保护壳的时候能否从外表就能看出保护壳材质?P ...

  2. 7.3.2 Using Backups for Recovery 使用备份用于恢复

    7.3.2 Using Backups for Recovery 使用备份用于恢复 现在,假设我们有一个灾难性的crash 在星期三上午8点. 需要恢复从备份恢复,为了恢复,我们首选需要恢复最近的全备 ...

  3. 【Linux】鸟哥的Linux私房菜基础学习篇整理(十二)

    1. depmod [-Ane]:更新内核模块依赖.参数:无参数:depmod会主动分析目前内核的模块,并重新写入/lib/modules/$(uname -r)/modules.dep中:-A:de ...

  4. 【HDOJ】1158 Employment Planning

    简单DP. #include <cstdio> #include <cstring> #include <cstdlib> #include <climits ...

  5. LaTeX排版工具使用

    专业的论文,都是用Latex.CTex等相关的工具.那么,用word写论文,缺点在哪? latex 写的东西,最终要编译成pdf格式的.里面的格式,尤其是数学类符号等,比较漂亮.这是word不能比的. ...

  6. Ext tabpanel集成第三方charts(echarts、amcharts等)的问题(报getstyle为null的错误)

    最近在做ext集成charts的功能,主要是使用tabpanel,将charts集成到tab中,随便切换tab选项就会报错崩溃. 之前演示的时候也发现了该问题,由于在tab项中有加载svg文件的操作, ...

  7. SVN项目库错误Unsupported FS format svn: Expected FS format between '1' and '4'; found format '6'

    SVN项目库错误Unsupported FS format svn: Expected FS format between '1' and '4'; found format '6' 从这里找到解决方 ...

  8. DateTime用法二

    任何项目,难免会碰到DateTime的显示问题,.net框架虽提供丰富多样的显示方法,但我很少使用,因老忘记细节,每次都要纠结到底月份在前还是年份在前:日期分隔符到底是“/”,还是“\”,还是“-”等 ...

  9. 《Linear Algebra and Its Applications》-chaper1-线性方程组-线性相关性

    这篇文章主要简单的记录所谓的“线性相关性”. 线性相关性的对象是向量R^n,对于向量方程,如果说x1v1 + x2v2 + …+xmvm = 0(其中xi是常数,vi是向量)有且仅有一个平凡解,那么我 ...

  10. 通过jdbc取得数据库表结构信息

    做制作开发平台时,首要的一点是如何取得数据库表结构信息.一般通用的做法就是通过JDBC中的ResultSetMetaData类来进行操作,当你取得了数据库表结构信息后,比如说表的每个字段名称,字段类型 ...