ExtJS - 動態生成複選框

Question

我有一個複選框組，它將有一個動態數量的複選框。後端返回包含標籤和輸入值的數據。我循環這些記錄併爲每個記錄生成一個複選框對象。但是當我將生成的數組傳遞給items數組時，沒有任何反應。

這裏是我的複選框組類的片段。

Ext.define("MyApp.view.form.field.CheckboxGroup",{ 
    extend:"Ext.form.CheckBoxGroup", 
    ... 
    ... 
    initComponent:function(){ 

    this.items = getCheckboxes(); 

    ... 

    this.callParent(arguments); 
    }, 

    getCheckboxes:function(){ 
    Ext.Ajax.request({ 
     url:"blah/getcheckboxes", 
     scope:this, 
     success:function(resp_){ 
      var resp = Ext.JSON.decode(resp_.responseText); 
      var checkboxesArr = []; 
      if(resp.data){ 
      for(var i=0; i<resp.data.length; i++){ 
       checkboxesArr.push({boxLabel:resp.data[i].label, inputValue:resp.data[i].id, ....}); 
      } 
     } 
     return checkboxesArr; 
    }); 

/*return checkboxesArr = [ 
     {boxLabel: 'Yes', name: this.name, inputValue: 'Y'}, 
     {boxLabel: 'No', name: this.name, inputValue: 'N'}   
    ];*/ 
} 

如果我取消與2個複選框靜態checkboxesArr和返回相反，它的工作原理，但它不工作與checkboxesArr與後端反應生成。

感謝

Answer 1

Ajax調用是異步的，所以你可以add的項目，而不是：

getCheckboxes: function() { 
    Ext.Ajax.request({ 
     url: "data1.json", 
     scope: this, 
     success: function (resp_) { 
      var resp = Ext.JSON.decode(resp_.responseText); 

      var checkboxesArr = []; 

      if (resp.data) { 
       for (var i = 0; i < resp.data.length; i++) { 
        checkboxesArr.push({ 
         boxLabel: resp.data[i].label, 
         inputValue: resp.data[i].id 
        }); 
       } 
      } 
      this.add(checkboxesArr); 
     } 
    }); 
} 

工作例如：https://fiddle.sencha.com/#view/editor&fiddle/1lgc