extJs ドロップダウン ボックスのリンケージ実装 code_extjs

コードをコピー コードは次のとおりです:

// 最初のドロップダウン ボックス
var parentStore = new Ext .data.Store({
proxy: new Ext.data.HttpProxy({
url: 'loadByParentid.action?parentid=1001'
}),
reader: new Ext .data.JsonReader ({
ルート: 'リスト',
id: 'id'
}, [
{名前: 'id', マッピング: 'id'},
{ name: 'mc '、マッピング: 'name'}
])
});
// 2 番目のドロップダウン ボックス
var childStore = new Ext.data.Store({ proxy: new Ext .data.HttpProxy({
//ちなみに記述できるパラメータは次のとおりです。このデータ ソースは、最初のドロップダウン ボックスが選択されたときに読み込まれます。
url: 'loadByParentid .action?parentid=1001'
}),
reader: new Ext.data.JsonReader({
root: 'list',
id: 'id'
}, [
{名前: 'id'、マッピング: 'id'}、
{名前: 'mc'、マッピング: '名前'}
])
});
fieldLabel: 'カテゴリを選択してください' 、
xtype:'combo'、
store:parentStore、
valueField: "id"、
displayField: "mc"、
mode : 'local',
forceSelection: true ,//項目を 1 つ選択する必要があります
emptyText: 'カテゴリを選択してください...',//デフォルト値
hiddenName:'interviewsDetail.parent_category',// hiddenName は、バックグラウンドに送信された入力の名前です。
editable: false,//入力は許可されません
triggerAction: 'all',//このドロップダウンは選択のみ可能なため、属性を設定する必要がありますそうでない場合、オプションを選択すると、ドロップダウンにはオプション値のテキストに一致する選択項目のみが表示され、他の選択項目は表示されなくなるため、他のオプションを変更することはできません。
//allowBlank:false,//このオプションの値は空にすることはできません
id: 'parent_id',
name: 'parent',
width: 400,
listeners:{
select : function(combo, Record,index){
childStore.proxy= new Ext.data.HttpProxy({url: 'loadByParentid.action?parentid=' combo.value}); );
}
}
},{
xtype:'combo',
store: childStore,
valueField: "id",
displayField: "mc",
//データはローカルです
mode: 'local',
forceSelection: true,//1 つの項目を選択する必要があります
emptyText: 'サブカテゴリを選択してください...',//デフォルトvalue
hiddenName:'interviewsDetail.child_category', //hiddenName はバックグラウンドに送信された入力の名前です
editable: false, //入力は許可されません
triggerAction: 'all', // becauseこのドロップダウンは選択のみであるため、属性triggerActionをallに設定してください。それ以外の場合、オプションを選択すると、ドロップダウンにはオプション値のテキストに一致するオプションのみが表示され、他のオプションは表示されません。このようにすると、他のオプションは変更できなくなります。
//allowBlank:false,//このオプション値は空にすることはできません
fieldLabel: 'select'、
id: 'child_id'、
name: 'child'、
width: 400
}