ext 动态添加一行四级联动列表
var qytg_firstCombox;var qytg_secondCombox;var qytg_thirdCombox;var qytg_forthCombox;var firstTypeData = [['cp','产品'],['fw','服务'],['yy','运营']];var cpTypeData = [["changshang", "厂商"],["zongdaili", "总代理"],["jinxiaoshang", "经销商"],["jichengshang", "集成商"]];var fwTypeData = [["rj", "软件"],["zx", "咨询"],["wh", "维护"]];var yyTypeData = [["dx", "电信"]];var secondStore = new Ext.data.SimpleStore({fields:['secondTypeValue','secondTypeName']//data : firstTypeData });var firstStore = new Ext.data.SimpleStore({fields:['firstTypeValue','firstTypeName'],data : firstTypeData}); var thirdStore= new Ext.data.JsonStore({ fields:['typeName','typeID']});var forthStore= new Ext.data.JsonStore({ fields:['brandName','brandID']}); function getNewTypePanel(){ var firstcomid; var secondcomid; var thirdcomid; var forthcomid; var randomid; randomid=new Date().toString("yyyyMMddhhmmss"); firstcomid=randomid+"first"; secondcomid=randomid+"second"; thirdcomid=randomid+"third"; forthcomid=randomid+"forth"; panelcomid=randomid+"panel"; qytg_firstCombox=new Ext.form.ComboBox({ margins:'0 0 0 0', //fieldLabel: '选择类型', hiddenName :"first", id:firstcomid, displayField:'firstTypeName', valueField:'firstTypeValue', allowBlank:true, //value:'ok', height:25, width:156, //anchor:'90%', editable : false, mode:'local', store:firstStore, triggerAction : 'all' }); qytg_secondCombox=new Ext.form.ComboBox({ margins:'0 0 0 0', //fieldLabel: '选择类型', id:secondcomid, hiddenName:"second", displayField:'secondTypeName', valueField:'secondTypeValue', allowBlank:true, disabled:true, height: 25, width:156, //anchor:'90%', editable : false, mode:'local', store:secondStore, triggerAction : 'all' }); qytg_thirdCombox=new Ext.form.ComboBox({ margins:'0 0 0 0', //fieldLabel: '选择类型', hiddenName :"third", id:thirdcomid, displayField:'typeName', valueField:'typeID', allowBlank:true, disabled:true, width:156, height:25, //anchor:'90%', editable : false, mode:'local', store:thirdStore, triggerAction : 'all' }); qytg_forthCombox=new Ext.form.ComboBox({ margins:'0 0 0 0', //fieldLabel: '选择类型', id:forthcomid, hiddenName:'forth', displayField:'brandName', valueField:'brandID', disabled:true, allowBlank:true, width:156, height: 25, //anchor:'90%', editable : false, mode:'local', store:forthStore, triggerAction : 'all' }); Ext.getCmp(firstcomid).on("select",function(combo, record,index){ Ext.getCmp(secondcomid).clearValue(); if(Ext.getCmp(firstcomid).getValue()=="cp") { secondStore.loadData(cpTypeData); }else if(Ext.getCmp(firstcomid).getValue()=="fw") {secondStore.loadData(fwTypeData); Ext.getCmp(thirdcomid).setValue(0); Ext.getCmp(forthcomid).setValue(0); }else if(Ext.getCmp(firstcomid).getValue()=="yy") { secondStore.loadData(yyTypeData); Ext.getCmp(thirdcomid).setValue(0); Ext.getCmp(forthcomid).setValue(0); } Ext.getCmp(secondcomid).setDisabled(false); Ext.getCmp(thirdcomid).setDisabled(true); Ext.getCmp(forthcomid).setDisabled(true); Ext.getCmp(secondcomid).show(); }); Ext.getCmp(secondcomid).on("select",function(combo, record,index){ Ext.getCmp(thirdcomid).clearValue(); if(combo.getValue()=="changshang"||combo.getValue()=="zongdaili"||combo.getValue()=="jinxiaoshang"||combo.getValue()=="jichengshang") { Ext.getCmp(thirdcomid).setDisabled(false); Ext.getCmp(secondcomid).setDisabled(false); Ext.getCmp(forthcomid).setDisabled(true); Ext.Ajax.request({ url :'../getAllITTypes', mthod : 'post', success : function(response) { // alert(result.iTTypes); Ext.getCmp(thirdcomid).getStore().loadData(Ext.util.JSON.decode(response.responseText).iTTypes); } }); }else{ Ext.getCmp(thirdcomid).setValue(0); Ext.getCmp(secondcomid).setDisabled(false); Ext.getCmp(thirdcomid).setDisabled(true); Ext.getCmp(forthcomid).setDisabled(true); } }); Ext.getCmp(thirdcomid).on("select",function(combo, record,index){ Ext.getCmp(forthcomid).clearValue(); Ext.Ajax.request({ url :'../getBrandsByITType', mthod : 'post', params:{ typeID:combo.getValue() } , success : function(response) { if(Ext.util.JSON.decode(response.responseText).iTBrands!=""){ Ext.getCmp(forthcomid).setDisabled(false); Ext.getCmp(thirdcomid).setDisabled(false); Ext.getCmp(secondcomid).setDisabled(false); Ext.getCmp(forthcomid).getStore().loadData(Ext.util.JSON.decode(response.responseText).iTBrands); }else{ Ext.getCmp(thirdcomid).setDisabled(false); Ext.getCmp(secondcomid).setDisabled(false); Ext.getCmp(forthcomid).setDisabled(true); } } }); }); var arr=new Array(); arr.push(Ext.getCmp(firstcomid)); arr.push(Ext.getCmp(secondcomid)); arr.push(Ext.getCmp(thirdcomid)); arr.push(Ext.getCmp(forthcomid)); return arr; };var newBut =new Ext.Button({id : 'newNTaskBut',text : '添加',enableKeyEvents : true,handler : function() {blankPanel.items.items=getNewTypePanel();blankPanel.doLayout();}}); var blankPanel=new Ext.Panel({ fieldLabel:"<font color='red'>＊</font>经营范围", width:"100%", autoHeight : true, layout:"column", items:[newBut] });