web-dev-qa-db-ja.com

ExtJsComboBoxのストアを更新またはリロードします

ExtJsComboBoxのリスト値を更新または再読み込みする方法を知りたいのですが。たとえば、いくつかのチェックボックスがあります。これらのチェックボックスは、ComboBoxが持つべき値を決定します。それで、それらのいくつかを選択した後、私は溺死リスト(コンボボックス)をクリックして値を確認します。

つまり、ComboBoxの値(ストア)を変更するにはどうすればよいですか。

誰かが私を助けてくれることを願っています

ありがとう

14
user512514

私はこの文書化されていないExtJsAPI関数を使用して、実行時にストアを変更しています。

mycombobox.bindStore(newStore);

http://www.sencha.com/forum/showthread.php?40749-Change-Combobox-store-data-update のサポートチームが述べているように。

編集:ストアにデータが入力されたときに新しいデータを配置したい場合は、次のようにします

storeMyStore = new Ext.data.Store({
    ...
    listeners: {
        load: function(this, records, options) {
            cbMyCombo.bindStore( storeMyStore );
        }
    }
});
14
Roberto

ちょっとこんな感じになります

{
  xtype: 'checkbox',
  //configs
  listeners : {
     checked : function (checkbox, checkedBool) {
         var yourCombo = Ext.getCmp(yourComboID);

         //I'm not sure what params you will need to reload the comboBox from your
         // service but hopfully this will give the jist of things. . .

         yourCombo.store.reload(
                  {   
                     params: 
                         {yourParam : checkedBool},
                         {yourRowID : rowID}
                    });
      }
 }
7
It Grunt

ここでは、別のComboBoxで選択が行われた後に更新されるコンボボックスを作成します。基本的に、最終ユーザーは2つのコンボボックスを使用して、最初のコンボボックスで行われた選択に基づいてメインカテゴリとサブカテゴリを選択できます。

これは、FirstcomboBoxのストアです。

Ext.define("StoreSubject", {
extend: "Ext.data.Model",
fields: [
{
    name: 'i_Id'
},
{
    name: 's_Value'
}
]
});

var StoreSubject = Ext.create('Ext.data.JsonStore', {
model: 'StoreSubject',
proxy: {

    type: 'ajax',
    url: '../General/AdministrationDefaultXMLDOM.aspx?qid=15',
    reader: {
        type: 'json'
    }
}
});
StoreSubject.load();

これは、2番目のコンボボックスのストアです。

Ext.define("StoreLanguageGroup", {
extend: "Ext.data.Model",
fields: [
{
    name: 'i_Id'
},
{
    name: 's_Value'
}
]
});
var StoreLanguageGroup = Ext.create('Ext.data.JsonStore', {
model: 'StoreLanguageGroup',
proxy: {

    type: 'ajax',
    url: '../General/AdministrationDefaultXMLDOM.aspx?qid=16',
    reader: {
        type: 'json'
    }
}
});

Comoboxの私のコードは次のようになります。

最初のコンボボックス:

var cmbSubjectName = Ext.create('Ext.form.field.ComboBox', {
id: 'cmbSubjectName',
fieldLabel: '<b>Subject</b>',
name: 'cmbSubjectName',
valueField: 's_Value',
displayField: 's_Value',
allowBlank: false,
anchor: '80%',
labelWidth: 150,
emptyText: '[--Choose--]',
minChars: 0,
store: StoreSubject,
queryMode: 'local',
typeAhead: true,
listeners: {
    'select': {
        fn: function (combo, value) {
            var strSubjectName = Ext.getCmp('cmbSubjectName').getValue();
            Ext.getCmp('cmbLanguageType').clearValue();
            Ext.getCmp('cmbLanguageType').getStore().load({
                params: {
                    SubjectName: strSubjectName
                }
            });
        }
    }

},
});

このコードは、comboxストアを呼び出してオーバーライドするために使用されます(それ以外の場合は、ロードを継続します)

Ext.override(Ext.LoadMask, {
onHide: function () {
    this.callParent();
}
});

// ---------------------------

2番目のコンボボックス:

var cmbLanguageType = Ext.create('Ext.form.field.ComboBox', {
id: 'cmbLanguageType',
fieldLabel: '<b>Language</b>',
multipleSelect: false,
name: 'cmbLanguageType',
valueField: 's_Value',
displayField: 's_Value',
allowBlank: false,
anchor: '80%',
labelWidth: 150,
emptyText: '[--Choose--]',
minChars: 0,
store: StoreLanguageGroup,
queryMode: 'local',
typeAhead: true,
});

これがあなたを助けることを願っています..そして私の答えを評価してください

3
Santosh

チェックボックスのイベントリスナーで、ComboBoxが読み取っているストアへの参照を取得します。次に、追加関数または削除関数を呼び出して、チェックボックスの内容に基づいてストア内のデータを更新します チェック済み 更新が完了したら、ComboBoxコンポーネントでdoLayout()を呼び出します。ストアの現在の状態に基づいて自分自身を再レンダリングします。

ストアが更新されるたびに自動的に更新する方法があると思いますが、まだ使用していません。

0
Macy Abbey