這就是熬夜的成果!
非常的滿意
也感謝google大神與網路上眾多人的經驗分享
讓小弟的功力更上一層樓
ps.熬夜真的會傷身阿....
以下趕快來分享我的code吧!!!
//----------------第一個combobox選項----------------------
faculty_ds=new Ext.data.Store({
proxy: new Ext.data.ScriptTagProxy({
url: 'combo_faculty.php'
}),
// create reader that reads the Topic records
reader: new Ext.data.JsonReader({
root: 'data',
totalProperty: 'totalCount',
id: 'faculty_id'
}, [
{name: 'faculty_id'},
{name: 'faculty_name'}
]),
// turn off remote sorting for local sorting
remoteSort: false
});
//----------------------------------------------------
//-------------第二combobox選項-----------------------
faculty_ch_ds=new Ext.data.Store({
proxy: new Ext.data.ScriptTagProxy({
method:'post',
url: 'combo_ch_faculty.php'
}),
autoLoad:'false',
// create reader that reads the Topic records
reader: new Ext.data.JsonReader({
root: 'data',
totalProperty: 'totalCount',
id: 'ch_fa_id'
}, [
{name: 'ch_fa_id'},
{name: 'ch_fa_name'}
]),
// turn off remote sorting for local sorting
remoteSort: false
});
//----------------------------------------------------------
//-----------------------建立第一個combobox------------------
facombo = new Ext.form.ComboBox({
fieldLabel: '請選擇xx',
//disabled:true,
name: 'faculty',
mode: 'remote',
store: faculty_ds,
displayField:'faculty_name',
valueField:'faculty_id',
allowBlank :true,
emptyText:'請選擇xx...',
typeAhead: true,
triggerAction:'all',
editable: false,
forceSelection: true
});
//-------------------------------------------------------
//----------------------建立第二個combox---------------------------
ch_fa_combo = new Ext.form.ComboBox({
//disabled:true,
fieldLabel: '請選擇xx',
name: 'faculty',
mode: 'local',
store: faculty_ch_ds,
displayField:'ch_fa_name',
valueField:'ch_fa_id',
allowBlank :true,
emptyText:'請先選擇xx...',
typeAhead: true,
triggerAction:'all',
editable: false,
//renderTo:'fa',
forceSelection: true
});
//---------------------------------------------------------
var testform = new Ext.FormPanel({
labelWidth: 75, // label settings here cascade unless overridden
frame:true,
title: 'xx查詢',
bodyStyle:'padding:5px 5px 0',
width: '100%',
defaults: {width: 230},
defaultType: 'textfield',
items: [{
id: 'first',
fieldLabel: 'First Name',
name: 'first',
value: 'test',
allowBlank:false
},facombo,ch_fa_combo]
});
testform.render(Ext.get("tform"));
facombo.on('select',ajax_combo);
function ajax_combo(){
var va = facombo.getValue();
//alert(va);
ch_fa_combo.store.reload({params:{ch:va}});
//faculty_ch_ds.load({params:{ch:va}});
}
大部分code都沒什麼好講的
唯獨我標明紅色的部份是最重要的!
要非常注意
要變動的combobox remote一定要設為local!!
如果設remote
在第一次store.reload的時後會出錯
雖然第二次之後會正常
但是沒有人的網頁是第一次出錯接下來正常的吧~?
卡在這卡了最久....
決定把他記錄下來!
如有說明錯誤歡迎指正
- Feb 10 Sun 2008 04:35
ExtJS Combobox 的聯動
全站熱搜
留言列表