2011-03-31 55 views
0

我正在構建一個複選框組,其中的商品來自在Ext.OnReady函數中加載的商店。我試圖將這個複選框組添加到一個formpanel中,並在add()調用中得到這個錯誤。 'events'爲空或不是對象。動態添加複選框組到一個窗體面板

這裏是我與嘗試代碼..

Ext.onReady(function() { 
{ 
    store.each(function (record) { 
     var itemID = record.get('itemID') 
     var itemDesc = record.get('itemDesc'); 
     jsonDataArray.push([itemID,itemDesc]); 
    }); 

    myCheckboxGroup = new Ext.form.CheckboxGroup({ 
     id: 'chk1', 
     xtype: 'checkboxgroup', 
     width: 520, 
     border: true, 
     items: jsonDataArray 
    }); 

    myForm.add(myCheckboxGroup); 
    myForm.doLayout(); 
} 

var myForm = new Ext.form.FormPanel({ 
    id: 'myForm', 
      region: 'center', 
      border: true, 
      autoHeight: true, 
      items: myCheckboxGroup 

}); 
+0

演示你能解決你的代碼的格式嗎?很難說出發生了什麼,它看起來像JavaScript是無效的。 – Craig 2011-03-31 13:39:53

回答

1

使用的xtype有由佈局管理器創造了一切,確保你是給你一些羣體複選框來呈現,並定義一個佈局類型爲你的形式。你也需要把這個表單放在別的東西里面(比如一個窗口)或者把它呈現給頁面主體。

var myForm = new Ext.form.FormPanel(
{ 
    id:  'myForm', 
    region: 'center', 
    layout: 'form', 
    border: true, 
    autoHeight: true, 
    items: [{ 
     id: 'chk1', 
     xtype: 'checkboxgroup', 
     width: 520, 
     border: true, 
     items: [ 
      {boxLabel: 'Item 1', name: 'cb-1'}, 
      {boxLabel: 'Item 2', name: 'cb-2', checked: true}, // checked 
      {boxLabel: 'Item 3', name: 'cb-3'}, 
     ] 
    }] 
}); 

現在只需用您的JSON版本替換'items'代碼就可以了。確保你已經從你的Ajax調用中返回並在你嘗試這個之前將你的響應轉換成JSON。

查看此主題的論壇主題以獲取更多信息:ExtJs Forum Thread

0
new Ext.form.FormPanel({ 
    title: 'Test Form', 
    labelWidth: 120, 
    width: 350, 
    padding: 10, 
    tbar: [{ 
     text: 'Add CheckboxGroup', 
     handler: function() { 
      formPanel.add({ 
       xtype: 'checkboxgroup', 
       fieldLabel: 'My CheckboxGroup', 
       columns: 1, 
       items: items 
      }); 
      formPanel.doLayout(); 
      this.disable(); 
     } 
    }], 
    items: comboBox, 
    renderTo: 'output' 
}); 

這裏http://ext4all.com/post/extjs-3-add-a-checkboxgroup-dynamically-to-a-form