火狐、IE浏览器实现Extjs的grid表格的复制、粘贴
2015-05-22 00:00
441 查看
从后台获取参数,一次填入ext:grid网状表格,发现表格内的数据不能复制粘贴,只能read...,火狐和IE 11都不能复制。
火狐解决方案
IE解决方案
直接修改ext-all.js文件,将下面一个地方的unselectable="on"值改为unselectable=""即可
下面样式不确定要不要加,大家测试下,本人忘记了
火狐解决方案
局部定义表格复制、粘贴的样式: 1.在jsp、html中的<head></head>中添加css样式: <style type="text/css"> .x-selectable, .x-selectable * { -moz-user-select: text!important; -khtml-user-select: text!important; } </style> 2.在grid中添加: grid=new Ext.grid.GridPanel({ viewConfig: { 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>' ) } }, ....}) 全局定义复制、粘贴的样式: 1、在*.css文件中添加样式: .x-selectable, .x-selectable * { -moz-user-select: text!important; -khtml-user-select: text!important; } 2、新建一个js文件,写入如下内容: 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>' ); 3、在每一个需要复制,粘贴的grid的中引入此js(注:必须在ext-all.js后引入)
IE解决方案
直接修改ext-all.js文件,将下面一个地方的unselectable="on"值改为unselectable=""即可
{c.cell=new Ext.Template('<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} {css}" style="{style}" tabIndex="0" {cellAttr}>','<div class="x-grid3-cell-inner x-grid3-col-{id}" unselectable="" {attr}>{value}</div>',"</td>")}for(var a in c){var b=c[a];if(b&&Ext.isFunction(b.compile)&&!b.compiled){b.disableFormats=true;b.compile()}}this.templa
下面样式不确定要不要加,大家测试下,本人忘记了
<style type="text/css"> .x-grid3-cell-text-visible .x-grid3-cell-inner {overflow:visible;padding:3px 3px 3px 5px;white-space:normal;word-wrap: break-word; } </style>
相关文章推荐
- 实现Extjs的grid表格的复制、粘贴
- Extjs的grid表格的复制、粘贴
- Extjs的grid表格的复制、粘贴
- 【JavaScript】实现将从Excel中复制的数据粘贴到WEB页面Grid中
- 使extjs的grid内容可复制粘贴
- JS+flash实现chrome和ie浏览器下同时可以复制粘贴
- extjs4 grid 实现可以选择文本内容进行复制
- ExtJs实现SearchGrid查询表格
- ExtJs的Ext.grid.GridPanel不能选择复制表格中的内容解决方案
- 用JAVA实现将execl表格中多行数据复制粘贴到现有页面上(js控制)
- extjs表格文本启用选择复制功能具体实现
- JS+flash实现chrome和ie浏览器下同时可以复制粘贴
- 在StringGrid中用右键菜单实现复制粘贴
- ExtJs的Ext.grid.GridPanel不能选择复制表格中的内容解决方案
- 【JavaScript】实现将从Excel中复制的数据粘贴到WEB页面Grid中
- Extjs实现Grid表格显示【一】
- extjs表格(Ext4 Grid)文本启用选择复制功能
- 使extjs的grid内容可复制粘贴
- extjs表格文本启用选择复制功能具体实现
- extjs表格(Ext4 Grid)文本启用选择复制功能