1

我想锁定网格的前几列，并为其余列提供水平滚动。我正在使用列标题分组。

我使用了 locked : true 属性并为这些列设置了静态宽度。然而什么都没有发生。我已经检查了所有可能的文档。不知道错误在哪里。有人可以帮我吗？

代码如下

查看.js'

Ext.define('MyModel.view.graphPanel', {
    extend: 'Ext.grid.Panel',
    layout:'border',
    alias: 'widget.graphPanel',
    name:'graphPanel',
    title: 'Tests',
    store: 'MyModel.store.settingStore',
    viewConfig: {
        stripeRows: true
    },
    columnLines: true,
    split:true,
    frame: true
});

控制器.js

Ext.define('MyModel.controller.myController', {
   extend:'Ext.app.Controller',
   models:['MyModel.model.settingModel'],
   stores:['MyModel.store.settingStore'],
   init: function() {
   Ext.Ajax.request({
            url: 'Sample.xml',
            success: function(response, opts) {
            var txt = response.responseText;
            parser=new DOMParser();
            xmlDoc=parser.parseFromString(txt,"text/xml");
            var columnArr = [];
            var outercolumnarr = [];
            var fieldArr = [];
            modelfieldArr = [];
            completeDataArr=[];

            //This builds all locked set of columns
            var headerArr = xmlDoc.getElementsByTagName('HEADER1');
            Ext.each(headerArr[0].getElementsByTagName('HEADER2'), function(header, index) {
                columnArr.push({
                    text: header.getAttribute('TEXT'),
                    dataIndex: header.getAttribute('DATAINDEX'),
                    locked:true,
                    width:100,
                    forceFit: true
                });
            });
            outercolumnarr.push({
                text:"General data",
                 width:400,
                columns:columnArr,
                locked:true
            });

            //Building scrollable columns
                var days = ['Sun','Mon',Tue'];
                Ext.each(days, function(day, index) {
                    columnArr = [];
                    Ext.each(headerArr[1].getElementsByTagName('HEADER2'), function(innerHeader, index) {
                    columnArr.push({    
                        text: innerHeader.getAttribute('TEXT'),
                        dataIndex: innerHeader.getAttribute('DATAINDEX')
                        });
                    });
                    outercolumnarr.push({
                        text:day,
                        columns:columnArr,
                    });
            });
            //outercolumnarr contains the final column array
            //Similarly build data array, model and field array for stores and models. 

            var store = Ext.data.StoreManager.lookup('MyModel.store.settingStore');
            store.setFields(modelfieldArr);
            store.setData(completeDataArr);

            //Reconfigure the grid
             var gridview = Ext.ComponentQuery.query('graphPanel')[0];
            gridview.reconfigure(store,outercolumnarr);

        }
    });
 }
});
4

1 回答 1

1

因为您正在使用重新配置添加列，enableLocking所以没有隐式启用。您必须手动启用它。您可以在MyModel.view.graphPanel定义中启用它，但可能您还需要添加空列定义 ( columns: [])，因为如果没有它，我的框架就会出错。

工作样本：http: //jsfiddle.net/nj4nk/11/

于 2014-09-21T08:10:40.840 回答