EditorGridPanel 中的checkbox 选中,不选中的问题

dataminer_2007

关注

原创最新推荐文章于 2022-11-02 17:34:21 发布 2.7k 阅读 AI 写同款· GEO 优化 ›

Extjs应用札记之-Grid中checkboxSelectionMode非活性（disabled）终于轻松了些，重新享受告别了很久的双休，这段时间的连续加班，终于缓过来了些。这客户实在是太变态了，不过到让我了解了些Extjs的东西，也算是有得有失吧。没有系统学过Extjs，只是在开发的时候用到一点，就去学一点，不会的就查查API，还解决不了，就上网搜一搜。再不行就只有自己想办法了。不过这变态的客户还真能折腾出很多问题，在API甚至是网上都没法直接找到答案的，这可难着我了。不过还好，问题总能找到解决办法。这些天实在是挺难熬的，在网上也找不到帮助，所以决定把这段时间的经历都写下来，希望能对需要的人阅读详情

使用 Extjs 在进行数据库编程经常会遇到 checkbox 的问题(奇怪网上却没有此类文章不知道其他人是怎么解决的,在此贴上我的方法,如有问题或建议,欢迎指正), 比如在数据中的 status 存储的值为 'Y' / 'N' 或者是其他非 true / false 的值, 要求显示在gridPanel 中, 如果不进行转换,显示的时候就会有问题,因为 gridPanel 中的 Checkbox(CheckColumn) 的值默认为只有两种： true / false. 这样的话只要 status 的值不为空, 显示到页面的时候 checkbox 都会自动勾上;

解决的办法就是, 修改 checkcolumn.js 中 renderer 方法如下：

renderer : function(v, p, record){ p.css += ' x-grid3-check-col-td'; return String.format('<div class="x-grid3-check-col{0} {1}"> </div>', v=='Y' || v== true ? '-on' : '', this.createId()); }

如果还要在 gridPanel 中进行编辑的话(EditorGridPanel), 只修改 renderer 方法是不够的, 原因和上面一样,还需要修改 onMouseDown (鼠标点击)方法, 代码如下：

var value = record.data[this.dataIndex]; switch(value) { case 'Y': value = 'N'; break; case 'N': value = 'Y'; break; default: value = !value; } record.set(this.dataIndex, value);

收录于