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

修改extjs源码真正解决:ExtJs4.0 GridPanel 数据内容不能选中复制。

2013-08-26 18:35 573 查看

extJS 现在依然存在很多bug,有时挺烦人的。比如,最近就需要复制表格信息,extjs的grid却不支持,研究半天,覆盖了css,但只在非ie的浏览器有效。修改了extjs源码才解决了在ie的问题。

1、添加以下css代码:

 <style type="text/css">

       .x-grid-row

        {

           line-height:13px;vertical-align:top;padding:0 1px;-moz-user-select:text!important;-khtml-user-select:text!important;-webkit-user-select:text!important;

        }

        .x-grid-cell

        {

           overflow:hidden;font:normal 13px tahoma, arial, verdana,sans-serif;-moz-user-select:text!important;-khtml-user-select:text!important;-webkit-user-select:text!important;

        }

        .x-unselectable

        {

           -moz-user-select:text!important;-khtml-user-select:text!important;-webkit-user-select:text!important;

        }

</style>

2、修改extjs4.0的ext-all.js(或ext-all-debug.js)三处代码:

 找到 Ext.override(Ext.core.Element,{

    ....

            unselectable: function(){

               var me = this;

               me.dom.unselectable = "on";//1、把me.dom.unselectable= "on"修改为me.dom.unselectable =""

               me.swallowEvent("selectstart", true);//2、把ture改成false

               me.applyStyles("-moz-user-select:none;-khtml-user-select:none;");

               me.addCls(Ext.baseCSSPrefix + 'unselectable');

               return me;

            }

 

    ...

        });

 找到 Ext.override(Ext.view.TableChunker, {

    ...

            metaRowTpl:[

               '<tr class="' + Ext.baseCSSPrefix + 'grid-row {addlSelector}{[this.embedRowCls()]}" {[this.embedRowAttr()]}>',

                   '<tpl for="columns">',

                       '<td class="{cls} ' + Ext.baseCSSPrefix + 'grid-cell ' +Ext.baseCSSPrefix + 'grid-cell-{columnId} {{id}-modified} {{id}-tdCls}{[this.firstOrLastCls(xindex, xcount)]}" {{id}-tdAttr}><divunselectable="on"
//3、把此处的unselectable="on"改成unselectable="" 
class="' + Ext.baseCSSPrefix +'grid-cell-inner ' + Ext.baseCSSPrefix + 'unselectable"style="{{id}-style}; text-align:{align};">{{id}}</div></td>',

                   '</tpl>',

               '</tr>'

            ]

    ...

        });
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  浏览器 extjs4 源码 css bug
相关文章推荐