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'}         
    ];*/
}

Если я раскомментирую static 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/