您的位置:首页 > Web前端 > JavaScript

ExtJs疑难杂症之GridPanel单元格不能选中复制问题

2012-04-19 08:40 351 查看
Ext.grid.GridPanel有一个重大缺陷,就是单元格的内容不能选中,没法选中就没法复制,给用户带来很多不便。

分析: 用IE Developer Toolbar打开ExtJs输出的代码研究了一下,发现每个单元格的div都有一个属性:unselectable="on",看来是css在作怪。

版本: 2.2

解决办法: extJs官方论坛上有具体的解决办法,比较可行的如下。

step1:添加新的css样式。

CSS代码
<style type= "text/css" >
.x-selectable, .x-selectable * {
-moz-user-select: text! important ;
-khtml-user-select: text! important ;
}
</style>


step2:修改Ext.grid.GridPanel的protoType,我是自己写了一个新的js文件,记得要在ext-all.js后面引入。

JavaScript代码
if  (!Ext.grid.GridView.prototype.templates) {
Ext.grid.GridView.prototype.templates = {};
}
Ext.grid.GridView.prototype.templates.cell =  new  Ext.Template(
'<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} x-selectable {css}" style="{style}" tabIndex="0" {cellAttr}>' ,
'<div class="x-grid3-cell-inner x-grid3-col-{id}" {attr}>{value}</div>' ,
'</td>'
);


done!现在GridPanel的单元格可以选中了。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: