Question

我正在使用ExtJS5并尝试将对象项目放到卡片面板上，以便用户在单击树状面板时可以更改面板。但我不知道这是否是一种正确的方法。

var p = Ext.create('Ext.panel.Panel', {
    layout: 'card',
    items: [
        grid, bottompanel
    ]
});

我喜欢像Example

那样做

这是右侧的小组。

var grid = Ext.create('Ext.grid.Panel', {
    //title: 'Simpsons',
    title: 'Customers',
    height: 300,
    width:'100%',
    id: 'cus_grid',
    columns: [
        {text: "Customer ID", dataIndex: "id", flex: 1},
        {text: "Customer Name", dataIndex: "name", flex: 1},
        {text: "Services Name", dataIndex: "s_name", flex: 1},
        {text: "Services Type", dataIndex: "s_type", flex: 1}
    ],
    store: user,
    listeners : {
        itemclick: function(dv, record, item, index, e) {
            //alert(record.get('name')); 
            Ext.getCmp('infoForm').getForm().findField('id').setReadOnly(true);
            Ext.getCmp('infoForm').getForm().findField('s_type').setReadOnly(true);
            Ext.getCmp('infoForm').loadRecord(record);          
        }
    }
});

var bottompanel = Ext.create('Ext.form.Panel', {
    //region: 'center',
    title: 'Information',
    bodyPadding: 10,
    flex:1,
    width:'100%',
    id: 'infoForm',
    items: [{
                xtype: 'textfield',
                name: 'id',
                fieldLabel: 'Customer ID',
                allowBlank: false  // requires a non-empty value
            },{
                xtype: 'textfield',
                name: 'name',
                fieldLabel: 'Name',
                allowBlank: false  // requires a non-empty value
            }, {
                xtype: 'textfield',
                name: 's_name',
                fieldLabel: 'Services Name',
                allowBlank: false  // requires a non-empty value
            }, cmbBox],
            // Reset and Submit buttons
            buttons: [],
            tbar: toolBar
});

谢谢。

Answer 1

我解决了这个问题......

我忘了在卡片面板中添加宽度，因此发生了错误。

谢谢。

extjs如何使用treepanel更改面板

1 个答案: