extjs - ラジオグループを使用したExtjs

Question

静的jsonストアをextのradiogroupにバインドできますか？

Answer 1

ExtJS では、ラジオグループとストアは直接関係ありません。ストアからフォームの値を入力するのは簡単ですが、ストアを使用して実際にフィールドを作成するには、多少の回避策が必要です。具体的には、次のようなことを行う必要があり (Ext 3.3.1 を想定)、JsonStore は既にセットアップされています...

var store = <your predefined store, with records>;
var itemsInGroup = [];

store.each( function(record) {
  itemsInGroup.push( {
      boxLabel: record.someLabel, 
      name: record.someName, 
      inputValue: record.someValue
    });  
});

var myGroup = { 
  xtype: 'radiogroup', 
  fieldLabel: 'My Dynamic Radiogroup', 
  items: itemsInGroup 
};

Answer 2

この操作には dataView を使用できます。ストアの値に応じて、ラジオ ボタンを追加できます。ストアに 5 つのアイテムがあり、5 つのラジオ ボタンが表示されるとします。

    var tpl = new Ext.XTemplate('<tpl for=".">', '<div class="thumb-wrap" style="width:210px; float: left;">', '<label >', '<tpl>', '<input type=radioField value={fieldId} >', '</tpl>', '{dataViewFieldName}', '</label>', '</div>', '</tpl>', {            
    });
    var me = this;

this.items = new Ext.DataView({
        store: this.store,
        tpl: tpl,            
        overClass: 'x-view-over',
        itemSelector: 'div.thumb-wrap',           
        autoScroll: true            
    });
    this.callParent();
},