Сетка внутри Tab - PullRequest
Новая
       14

Сетка внутри Tab

1 голос
/ 21 июня 2011

Я пытаюсь поместить объект Grid (Ext.grid.GridPanel) внутри вкладки.

Это код: 

var grid = new Ext.grid.GridPanel({
    store: new Ext.data.Store({
        autoDestroy: true,
        reader: reader,
        data: xg.dummyData
    }),
    colModel: new Ext.grid.ColumnModel({
        defaults: {
            width: 120,
            sortable: true
        },
        columns: [
            {id: 'company', header: 'Company', width: 200, sortable: true, dataIndex: 'company'},
            {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
            {header: 'Change', dataIndex: 'change'},
            {header: '% Change', dataIndex: 'pctChange'},
            // instead of specifying renderer: Ext.util.Format.dateRenderer('m/d/Y') use xtype
            {
                header: 'Last Updated', width: 135, dataIndex: 'lastChange',
                xtype: 'datecolumn', format: 'M d, Y'
            }
        ]
    }),   
    sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
    width: 600,
    height: 300,
    frame: true,
    title: 'Framed with Row Selection and Horizontal Scrolling',
    iconCls: 'icon-grid'
});

this.tabs = new Ext.TabPanel({
    fullscreen: true,
    type: 'dark',
    sortable: true,
    dockedItems: [
    {
        xtype:'toolbar',
        title:'Hello World'
    }],
    tabBar: {
        ui: 'light',
        layout: {
            pack: 'left'
        }
    },
    items: [
    {
        cls:'hello',
        id:'tab1',
        html : '<a>hello</a>',
        title:'Monitor'
    }, {
        cls:'world',
        id:'tab2',    
        xtype: 'map',                 
        html : '<a>hello world</a>',
        title:'Map'
    }, {
        cls:'world',
        id:'tab3',                                
        html : '<a>hello world</a>',
        dockedItems:grid
    }]
});

Когда я загружаю страницу, нетошибка, но сетка не отображается.

1 Ответ

3 голосов
/ 21 июня 2011

Сетка не является закрепленным элементом (это для панелей инструментов и других вещей, которые должны прилипать к одной стороне контейнера). Если вы хотите, чтобы сетка занимала всю вкладку, просто добавьте ее непосредственно как элемент на панель вкладок, и она станет полной вкладкой: 

items: [
{
    cls:'hello',
    id:'tab1',
    html : '<a>hello</a>',
    title:'Monitor'
}, {
    cls:'world',
    id:'tab2',    
    xtype: 'map',                 
    html : '<a>hello world</a>',
    title:'Map'
},
grid ]
...