extJs 下拉框聯(lián)動實現(xiàn)代碼
更新時間:2010年04月09日 13:27:19 作者:
extJs 下拉框聯(lián)動實現(xiàn)代碼,需要的朋友可以參考下。
復(fù)制代碼 代碼如下:
// 第一個下拉框
var parentStore = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: 'loadByParentid.action?parentid=1001'
}),
reader: new Ext.data.JsonReader({
root: 'list',
id: 'id'
}, [
{name: 'id', mapping: 'id'},
{name: 'mc', mapping: 'name'}
])
});
// 第二個下拉框
var childStore = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
//這里是參數(shù)可以順便寫,這個數(shù)據(jù)源是在第一個下拉框select的時候load的
url: 'loadByParentid.action?parentid=1001'
}),
reader: new Ext.data.JsonReader({
root: 'list',
id: 'id'
}, [
{name: 'id', mapping: 'id'},
{name: 'mc', mapping: 'name'}
])
});
{
fieldLabel: '請選擇分類',
xtype:'combo',
store: parentStore,
valueField :"id",
displayField: "mc",
mode: 'local',
forceSelection: true,//必須選擇一項
emptyText:'請選擇分類...',//默認(rèn)值
hiddenName:'interviewsDetail.parent_category',//hiddenName才是提交到后臺的input的name
editable: false,//不允許輸入
triggerAction: 'all',//因為這個下拉是只能選擇的,所以一定要設(shè)置屬性triggerAction為all,不然當(dāng)你選擇了某個選項后,你的下拉將只會出現(xiàn)匹配選項值文本的選擇項,其它選擇項是不會再顯示了,這樣你就不能更改其它選項了。
//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});
childStore.load();
}
}
},{
xtype:'combo',
store: childStore,
valueField :"id",
displayField: "mc",
//數(shù)據(jù)是在本地
mode: 'local',
forceSelection: true,//必須選擇一項
emptyText:'請選擇子分類...',//默認(rèn)值
hiddenName:'interviewsDetail.child_category',//hiddenName才是提交到后臺的input的name
editable: false,//不允許輸入
triggerAction: 'all',//因為這個下拉是只能選擇的,所以一定要設(shè)置屬性triggerAction為all,不然當(dāng)你選擇了某個選項后,你的下拉將只會出現(xiàn)匹配選項值文本的選擇項,其它選擇項是不會再顯示了,這樣你就不能更改其它選項了。
//allowBlank:false,//該選項值不能為空
fieldLabel: '選擇',
id : 'child_id',
name: 'child',
width: 400
}
您可能感興趣的文章:
- javascript實現(xiàn)省市區(qū)三級聯(lián)動下拉框菜單
- 省市區(qū)三級聯(lián)動下拉框菜單javascript版
- jsp從數(shù)據(jù)庫獲取數(shù)據(jù)填充下拉框?qū)崿F(xiàn)二級聯(lián)動菜單的方法
- js實現(xiàn)的下拉框二級聯(lián)動效果
- js 自定義的聯(lián)動下拉框
- JavaScript Ajax Json實現(xiàn)上下級下拉框聯(lián)動效果實例代碼
- jQuery+jsp下拉框聯(lián)動獲取本地數(shù)據(jù)的方法(附源碼)
- 原生JavaScript實現(xiàn)動態(tài)省市縣三級聯(lián)動下拉框菜單實例代碼
- javascript省市區(qū)三級聯(lián)動下拉框菜單實例演示
- js實現(xiàn)下拉框二級聯(lián)動
相關(guān)文章
Extjs4.0 ComboBox如何實現(xiàn)三級聯(lián)動
Extjs4.0 ComboBox如何實現(xiàn)三級聯(lián)動,許多網(wǎng)友都很好奇這個問題,明確的一點是在extjs4.0中要使用load來獲取數(shù)據(jù),到底如何實現(xiàn),下面小編為大家分享具體步驟2016-05-05
ExtJS如何設(shè)置與獲取radio控件的選取狀態(tài)
radio控件的選取狀態(tài)如何設(shè)置與獲取,下面使用ExtJS來簡單實現(xiàn)下,感興趣的朋友可以參考下2014-01-01
關(guān)于extjs4如何獲取grid修改后的數(shù)據(jù)的問題
如何獲取grid修改后的數(shù)據(jù)問題,下面是API的描述??梢垣@取各種值,感興趣的朋友可以參考下2013-08-08
Extjs學(xué)習(xí)過程中新手容易碰到的低級錯誤積累
新手在學(xué)習(xí)Extjs過程中的低級錯誤積累2010-02-02
Extjs4 消息框去掉關(guān)閉按鈕(類似Ext.Msg.alert)
類似Ext.Msg.alert();但沒有關(guān)閉按鈕,由于Extjs4消息框中的關(guān)閉按鈕,沒有執(zhí)行回調(diào)函數(shù),點擊關(guān)閉按鈕后,直接關(guān)閉窗口,接下來為大家詳細(xì)介紹下去掉關(guān)閉按鈕2013-04-04
ComboBox 和 DateField 在IE下消失的解決方法
開發(fā)過程中卻遇到了在 IE 瀏覽器中放大、縮小窗口大小會導(dǎo)致這兩個組件消失不見不報任何錯誤且在其他瀏覽器正常,通過本文你將學(xué)會如何解決此問題2013-08-08
Extjs學(xué)習(xí)筆記之九 數(shù)據(jù)模型(上)
本文開始進入Extjs最核心最優(yōu)秀的部分。2010-01-01
Ext JS 4實現(xiàn)帶week(星期)的日期選擇控件(實戰(zhàn)一)
有一些日期選擇的需求是要看到星期,就是日期中的哪一天是這一年的第幾周,遺憾的是Ext js 并沒有提供這樣的配置,下面為大家分享下理想的解決方法2013-08-08

