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:'請選擇分類...',//默認值
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:'請選擇子分類...',//默認值
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)文章
Extjs中ComboBoxTree實現(xiàn)的下拉框樹效果(自寫)
最近涉及到的一個項目中,需要實現(xiàn)ComboBoxTree的效果,由于在Extjs中是沒有這種效果,所以看看別人的資料自己寫了一個,感興趣的朋友可以參考下哈2013-05-05Ext GridPanel加載完數(shù)據(jù)后進行操作示例代碼
Ext GridPanel加載完數(shù)據(jù)后進行操作,比如load數(shù)據(jù)之后選定某些行數(shù)據(jù),下面有個示例,需要的朋友可以參考下2014-06-06extjs表格文本啟用選擇復(fù)制功能具體實現(xiàn)
extjs提供了方便的表格組件grid供使用,但是默認情況下表格中的文本是不能被選中的,自然也是無法復(fù)制的,下面就為大家介紹下選擇復(fù)制功能如何啟用,感興趣的朋友可以了解下2013-10-10ComboBox 和 DateField 在IE下消失的解決方法
開發(fā)過程中卻遇到了在 IE 瀏覽器中放大、縮小窗口大小會導(dǎo)致這兩個組件消失不見不報任何錯誤且在其他瀏覽器正常,通過本文你將學(xué)會如何解決此問題2013-08-08Extjs學(xué)習(xí)筆記之三 extjs form更多的表單項
本文接著上講Extjs學(xué)習(xí)筆記之二 Extjs之Form介紹Extjs的表單。Extjs除了類似普通的html form的表單項之外,還有一些功能更為豐富實用的表單項。2010-01-01