Extjs gridPanel可复制配置

ExtJS默认是禁用了文本复制的功能,实际需求中可能需要能够复制,那么如何解决了,我在网上看到了许多解决办法,绝大部分都是从重写CSS样式或者重写gridView代码入手,我遇到这个问题的时候,我想作为如此成熟的一个JS框架,应该有某个配置开关对应是否需要复制文本的功能。于是我从逐层分析源码,最终让我找到了其开关名称。

技术分享

找到这里,一切都明白了,只要通过配置enableTextSelection属性就可以了,其实我们在gridView中可以找到这个属性。

技术分享

接下来就是如何在gridPanel中配置了,只需要在viewConfig中配置这个属性就可以了。借助官网API上的gridPanel上的例子来说明下。

 

[javascript] view plaincopyprint?技术分享技术分享
 
  1. Ext.create(‘Ext.data.Store‘, {  
  2.             storeId:‘simpsonsStore‘,  
  3.             fields:[‘name‘, ‘email‘, ‘phone‘],  
  4.             data:{‘items‘:[  
  5.                 { ‘name‘: ‘Lisa‘,  "email":"[email protected]",  "phone":"555-111-1224"  },  
  6.                 { ‘name‘: ‘Bart‘,  "email":"[email protected]",  "phone":"555-222-1234" },  
  7.                 { ‘name‘: ‘Homer‘, "email":"[email protected]",  "phone":"555-222-1244"  },  
  8.                 { ‘name‘: ‘Marge‘, "email":"[email protected]", "phone":"555-222-1254"  }  
  9.             ]},  
  10.             proxy: {  
  11.                 type: ‘memory‘,  
  12.                 reader: {  
  13.                     type: ‘json‘,  
  14.                     root: ‘items‘  
  15.                 }  
  16.             }  
  17.         });  
  18.   
  19.         Ext.create(‘Ext.grid.Panel‘, {  
  20.             title: ‘Simpsons‘,  
  21.             store: Ext.data.StoreManager.lookup(‘simpsonsStore‘),  
  22.             columns: [  
  23.                 { header: ‘Name‘,  dataIndex: ‘name‘ },  
  24.                 { header: ‘Email‘, dataIndex: ‘email‘, flex: 1 },  
  25.                 { header: ‘Phone‘, dataIndex: ‘phone‘ }  
  26.             ],  
  27.             viewConfig:{  
  28.                 enableTextSelection:true  
  29.             },  
  30.             renderTo: Ext.getBody()  
  31.         });  

 

效果截图如下。

技术分享

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。