Question

我有一个窗口，其中的项目包括2个项目，如

var win = Ext.create('Ext.window.Window', {
        title: 'Hello',
        height: 200,
        width: 400,
        layout: 'fit',
        items: {  
            xtype: 'form',
            border: false,
            hidden: true,
            items: [{
                xtype: 'textfield',
                fieldLabel: '1'
            },{
                xtype: 'textfield',
                fieldLabel: '2'
            }]
        }
    }).show();

我按下了一个按钮，我希望在我的窗口中显示/隐藏第一项（fieldLabel : '1'）

 Ext.create('Ext.Button', {
        text: 'Show first item',
        visible: false,
        renderTo: Ext.getBody(),
        handler: function() {
            win.down('form').items.items[0].show(); // not working
        }
    });

但那不起作用。如何解决这个问题

ps：我不想用id来获取comp，b / c我的表单是动态的谢谢
这是我的完整代码 http://jsfiddle.net/aMKjN/

Answer 1

试试这个。它只会显示第一个textfield。

Ext.create('Ext.Button', {

    text: 'Show first item',

    visible: false,

    renderTo: Ext.getBody(),

    handler: function() {

        win.items.items[0].show();
        win.items.items[0].items.items[1].hide();
    }
});

Answer 2

试试这个它只显示textfield 1

  Ext.onReady(function () {

   var win = Ext.create('Ext.window.Window', {
        title: 'Hello',
        height: 200,
        width: 400,
        layout: 'fit',
        items: {  
            xtype: 'form',
            border: false,
//            hidden: true,
            items: [{

                xtype: 'textfield',
                id:'first',
                 hidden: true,
                fieldLabel: '1'
            },{
                xtype: 'textfield',
                fieldLabel: '2'
            }]
        }
    }).show();

    Ext.create('Ext.Button', {
        text: 'Show first item',
        visible: false,
        renderTo: Ext.getBody(),
        handler: function() {            
          Ext.getCmp('first').setVisible(true)
        }
    });
});

Extjs 4.1 - 在表单中显示和隐藏一些特殊项目

2 个答案: