2015-09-28 744 views
1

我试图显示和隐藏radiogroups,基于从滴播选择的选择。所以,如果我选择东芝只有东芝车型出现,否则,如果我选择惠普只有马力车型出现。现在功能正在起作用,然而在选择任何东西之前,两种型号(hp和toshiba)都显示出来,但是我希望它只有东芝型号在开始时才显示。我试图给出hp模型,隐藏属性:true ..但是当选择hp时,模型不再出现。关于如何在开始时只显示一个模型的任何想法?在extjs中显示隐藏元素

toshibatypes = Ext.create('Ext.form.Panel', { 
     xtype: 'radiogroup', 
     defaultType: 'radio', 
     layout: 'hbox', 
     border:false, 
     id: 'toshiba', 
     width:'100%', 

     items: [ 
     { 
      checked: true, 
      boxLabel: 'Toshiba 1', 
      name: 'toshibas', 
      inputValue: 'toshiba1', 
      xtype:'radiofield' 
     }, 
     { 
      boxLabel: 'Toshiba 2', 
      name: 'toshibas', 
      inputValue: 'toshiba2', 
      xtype:'radiofield' 
     } 
    ] 
}); 



hptypes = Ext.create('Ext.form.Panel', { 
     xtype: 'radiogroup', 
       defaultType: 'radio', 
      layout: 'hbox', 
     border:false, 
     id: 'hp', 
     width:'100%', 

     items: [ 
     { 
      checked: true, 
      boxLabel: 'HP 1', 
      name: 'hps', 
      inputValue: 'hp1', 
      xtype:'radiofield' 
     }, 

     { 
      boxLabel: 'HP 2', 
      name: 'hps', 
      inputValue: 'hp2', 
      xtype:'radiofield' 
     }] 
}); 



    laptoptypes = Ext.create('Ext.form.ComboBox', { 
     store: laptops, 
     queryMode: 'local', 
     displayField: 'name', 
     valueField: 'abbr', 
     editable:false, 
     width: 100, 
     listeners: { 
     select: function() { 
     var iComboValue = laptoptypes.getValue(); 
      switch(iComboValue) { 
      case "toshibatypes" : 
      { 
       Ext.get("toshiba").show(); 
       Ext.get("hp").hide(); 

       break; 
      } 
      case "hptypes" : 
      { 
       Ext.get("hp").hide(); 
       Ext.get("toshiba").show(); 

       break; 
      } 

     } 
     } 
     } 
    }); 
+0

请同时添加一个标签以及您正在使用的相应版本:) – Tarabass

回答

2

如果在视图声明中隐藏配置,则可以使用setHidden(boolean)

var iComboValue = laptoptypes.getValue(); 

Ext.get("toshiba").setHidden(iComboValue !== 'toshibatypes'); 
Ext.get("hp").setHidden(iComboValue !== 'hptypes');