ExtJs的Ext.grid.GridPanel不能选择复制表格中的内容解决方案

最新推荐文章于 2021-01-14 02:36:59 发布

原创最新推荐文章于 2021-01-14 02:36:59 发布 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Extjs #grid #复制

Extjs 专栏收录该内容

1 篇文章

订阅专栏

本文详细介绍了在使用ExtJS4创建表格时，如何通过配置viewConfig中的enableTextSelection属性来实现表格内文本的选择功能，提供了一个基本的ArrayGrid实例作为示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

网上搜了一大堆，都是要改源码的。

仔细看看源码，其实只需要在创建grid的时候传个参数就行了。

具体看extjs4的api文档中的grid例子，BasicArrayGrid.

配置中viewConfig里配置enableTextSelection: true就可以了

// create the Grid
    var grid = Ext.create('Ext.grid.Panel', {
        store: store,
        stateful: true,
        collapsible: true,
        multiSelect: true,
        stateId: 'stateGrid',
        columns: [
            {
                text     : 'Company',
                flex     : 1,
                sortable : false,
                dataIndex: 'company'
            },
            {
                text     : 'Price',
                width    : 75,
                sortable : true,
                renderer : 'usMoney',
                dataIndex: 'price'
            },
            {
                text     : 'Change',
                width    : 75,
                sortable : true,
                renderer : change,
                dataIndex: 'change'
            },
            {
                text     : '% Change',
                width    : 75,
                sortable : true,
                renderer : pctChange,
                dataIndex: 'pctChange'
            },
            {
                text     : 'Last Updated',
                width    : 85,
                sortable : true,
                renderer : Ext.util.Format.dateRenderer('m/d/Y'),
                dataIndex: 'lastChange'
            },
            {
                menuDisabled: true,
                sortable: false,
                xtype: 'actioncolumn',
                width: 50,
                items: [{
                    icon   : '../shared/icons/fam/delete.gif',  // Use a URL in the icon config
                    tooltip: 'Sell stock',
                    handler: function(grid, rowIndex, colIndex) {
                        var rec = store.getAt(rowIndex);
                        alert("Sell " + rec.get('company'));
                    }
                }, {
                    getClass: function(v, meta, rec) {          // Or return a class from a function
                        if (rec.get('change') < 0) {
                            this.items[1].tooltip = 'Hold stock';
                            return 'alert-col';
                        } else {
                            this.items[1].tooltip = 'Buy stock';
                            return 'buy-col';
                        }
                    },
                    handler: function(grid, rowIndex, colIndex) {
                        var rec = store.getAt(rowIndex);
                        alert((rec.get('change') < 0 ? "Hold " : "Buy ") + rec.get('company'));
                    }
                }]
            }
        ],
        height: 350,
        width: 600,
        title: 'Array Grid',
        renderTo: 'grid-example',
        viewConfig: {
            stripeRows: true,
           //允许选中表格中的文本
           enableTextSelection: true
        }
    });