我用extjs的combo来做二级联动,
一级combo是本地数据,二级combo是数据库数据。思路:
 我又一张表:很多个字段,但是我希望动态获取其中三个字段的数据,即:netname,ip,city,三个字段,(注意:同一张表的)
第一个combo是本地数据:var data1 = [[1, "网站名"], [2, "城市"], [3, "IP地址"]],第一个combo里用“select”事件,来加载第二combo里需要的数据,而第二个combo的displayField属性是显示值,
其实也是对应联动数据库里的字段,这样就可以显示了。至于第二个combo的valueField,也可以和dispayField指向同一个数据库字段。我这样说不知道大家明白不?或则有无什么异议!第一个combo 主要代码:
var combo1 = new Ext.form.ComboBox({
store : new Ext.data.SimpleStore({
fields : ["value", "name"],
data : data1
listeners : {
"select" : function(combo, record, index) {
combo2.reset();
combo2.clearValue();
combo2.getStore().clearData();
if(combo1.getValue()==1){
combo2.displayField="netname"
}
else if(combo1.getValue()==2){
combo2.displayField="ip"
}
else if(combo1.getValue()==3){
combo2.displayField="city"
}
else{
Ext.Msg.alert("提示","您的输入有错误")//其实这里有点多余
}
combo2.getStore().proxy = new Ext.data.HttpProxy({
method : "post",
url : "./product/combosearch.action?param="
+ combo1.getValue()
})
combo2.getStore().load();注意,上面是动态的指定了第二个combo的displayField,以便和后台专递来的数据字段对应。我的理解是:只要displayField属性名和后台数据库字段名相同,就可以动态获得对应的数据。这种理解应该是对的,因为我确实获得了数据,并且正确显示了。
第二个combo很简单了:
var reader = new Ext.data.JsonReader({
totalproperty : "totalproperty",
root : 'root',
fields : ["name", "city"] })
var dd = new Ext.data.HttpProxy({
method : "post",
url : "./product/combosearch.action"
});
var combo2_store = new Ext.data.Store({
proxy : dd,
reader : reader })
var combo2 = new Ext.form.ComboBox({
store : combo2_store,
mode : "remote",
editable : true,
forceSelection : true,
triggerAction : "all",
emptyText : "请选择..."注意了:第二个combo里没有displayField,应为在第一个combo里动态指定的,我通过alert确认了,的确是可以动态指定displayField的。(valueField也是可以动态指定的,限于篇幅,省略了)那问题是什么呢?我第一个combo有三个下拉选线:网站名,ip地址,城市。对吧?我第一次选择三个中的任何一个,第二个combo都能正显示,
我再在第一个combo上选择其中的另外两个,第二个combo的下拉框就不能正常显示了,随意在不正常显示的下拉框中点击一下,可以看到数据正确的数据现在第二个combo的框中,
排除的问题:不是第二个store没有reload,也不是数据缓存问题,我问了很多群里朋友,都说数据重新加载,这样也不行!!没有办法了。我只有把三个字段分成三张表, 这个实现了联动,但是总感觉上面的那种方法是可行的!我感觉是 要么是我没有配置好,要么Exjt压根就没有这样实现!!如果上面的方法实现了,可以少些三张表,少很多后台程序!!美哉美哉!!遗憾遗憾啊!!!