如何在Ext.FormPanel中有一些元素和網格？

Question

我有一個ExtJs 3.4應用程序。
我想設置FormPanel中一些filds和網格我說：

  var searchPan = new Ext.FormPanel({ 
      title:'Поиск', 
      labelAlign: 'top', 
      frame:true, 
      //xtype:'panel', 
      //layout:'border', 
      //region: 'center', 
      split: true, 
      collapseMode: "mini", 
      collapsed:false, 
      items:[{ 
       xtype:'fieldset', 
       columnWidth: 0.5, 
       title: 'Поиск объектов', 
       collapsible: true, 
       collapsed: true, 
       autoHeight:true, 
       defaults: { 
        anchor: '-20' // leave room for error icon 
       }, 
       items: [{ 
         xtype:'textfield', 
         fieldLabel: 'Диспечерское наименование', 
         name: 'name_dispather', 
         anchor:'100%', 
         enableKeyEvents: true, 
         listeners: { 
          'keyup': function(e) { 
           if(e.getValue().length>=4){ 
            var searchFromValues=search.getForm().getValues(); 
            searchStore.load({params:{'name':e.getValue(),'type':searchFromValues.objType,'voltage':searchFromValues.objVolt}}); 
           } 
          } 
         } 
        },{ 
         layout:'column', 
         //defaults: {/*flex: 1, */layout: 'form',}, 
         items:[{ 
          columnWidth:.5, 
          layout: 'form', 
          items: [{ 
            xtype: 'combo', 
            anchor:'60%', 
            name:'objType', 
            fieldLabel: 'Тип Объектов', 
            store: new Ext.data.SimpleStore({ 
             data: [ 
              [1, 'ВЛ'], 
              [2, 'ТП'] 
             ], 
             id: 0, 
             fields: ['value', 'text'] 
            }), 
            valueField: 'value', 
            displayField: 'text', 
            triggerAction: 'all', 
            lazyRender:true, 
            mode: 'local', 
            editable: false 
           }] 
         },{ 
          columnWidth:.5, 
          layout: 'form', 
          items: [{ 
           xtype: 'combo', 
           anchor:'60%', 
           name:'objVolt', 
           fieldLabel: 'Напряжение', 
           store: new Ext.data.SimpleStore({ 
            data: [ 
             [1, '04'], 
             [2, '6'], 
             [3, '35'], 
             [4, '110'] 
            ], 
            id: 0, 
            fields: ['value', 'text'] 
           }), 
           valueField: 'value', 
           displayField: 'text', 
           triggerAction: 'all', 
           lazyRender:true, 
           mode: 'local', 
           editable: false 
          }] 
         },searchTab] 
        }] 
       }] 
     }); 

你看，我想有一個文本框，組合框2和形成一個網格。而結果是：

但我預計，組合框將網格上方。
我做錯了什麼？

UPDATE

當我使用的佈局：表像A1rPun的回答，我得到：

Answer 1

你正在做的幾件事情是錯誤的。首先嚐試儘量減少嵌套。做這樣的事情：

{ 
    xtype: 'form' 
    items: [{ 
     xtype: 'fieldset', 
     layout: 'table' 
     items: [{ 
      xtype:'textfield', 
      colspan: 2 
     },{ 
      xtype: 'combobox' 
     },{ 
      xtype: 'combobox' 
     }] 
    }] 
}, 
{ 
    xtype: 'grid' 
} 

接下來是每個容器佈局。您在沒有具有列布局的父項的項目上指定columnWidth。 Here是一個很好的佈局教程。

順便說一句：在代碼中找不到網格。