EXT N级 联动

 

function CasCadeMenu() {
 /*三者为私有属性,在被继承时必须被子类覆盖*/
 this.comboxIds = ["","city","county"];//级联菜单中所有combox的id值 若有用户无combox 则用""代替 如省用户
 this.valueField = ["CITY_ID","CITY_ID","COUNTY_ID"];/*不同用户在登录需要进行初始化的combox中的valueField字段 如省和市用户都是需                                                         要初始化city的Combox,那么valueField都为"CITY_ID"
                                                     */
 this.comboxLevel = [0,1,2];//0 代表省用户,1代表市用户, 2 代表县用户
 this.userLevel = 0;//登录用户级别 如默认为 0 即省用户
};
CasCadeMenu.prototype = {
 
 //获取登录用户级别 这个方法功能就是按照级别高低返回(0,1,2...)格式的级别,如默认省为 0 级别 则省用户返回0
 getUserLevel : function (casCadeMenuObj){//可能需要覆盖,如果获取级别形式不同的话
       
        DWREngine.setAsync(false);
   UserInfo.getUserLevel(function(data){
   casCadeMenuObj.userLevel = parseInt(data)-1;
   });
   DWREngine.setAsync(true);
   //需要减 1 就是因为省用户级别是1而combox联动级别由0开始算起
  },
  //页面加载时初始化级联菜单
 initCasCadeMenuOnLoad : function(){
    //初始化用 户登录级别
    this.getUserLevel(this);
   //初始化除最后个combox的其他所有combox的"select"监听器(所以才为 this.comboxIds.length-1)
    for(var k =0;k<(this.comboxIds.length-1);k++){
        if(this.comboxIds[k]!=""){
         this.addSelectListener(this.comboxIds[k],this.comboxLevel[k],this);
     }
    }
  //注释：由于省用户在级联菜单中不具有combox故不需要设置 combox值 直接运行下一步对下级初始化即可
  //根据用户级别设置用户所在级数以及该级数以上的combox值 如县用户为第二级,就要设置一级(市)与二级(县)的值
    var comboxObj=null;
    for(var i = 0;i<=this.userLevel;i++){
   
   //comboxIds[i]为0表示虽然有用户但该用户没有对应的combox
      if(this.comboxIds[i]=="") continue;
   //如果有则获取combox对象
   comboxObj = Ext.getCmp(this.comboxIds[i]);
   var loadData = this.getComboxData("",this.comboxLevel[i]); 
   //加载数据
   comboxObj.initialConfig.store.loadData(loadData);
   //设置初始值
   comboxObj.setValue(loadData[0][this.valueField[i]]);
   //设置本级及本级以上combox为不可选且不可修改(由于在IE7中采用disable有问题故采用另外一种方法)   
   //comboxObj.setDisabled(true);
  } 
  //设置该用户级别的下级联动数据
      this.initNextLevelData((comboxObj!=null)?comboxObj.getValue():"",this.comboxLevel[this.userLevel]);
 },
 /*
  * 初始化下一级别数据
  * @param upperComboxValue 上级combox的值 (用于根据此值得到下级combox需要的数据)
  * @param selfLevel 自身级别
 */
    initNextLevelData : function(selfComboxValue,selfLevel) {

   //下级联动的级别
     var nextLevel = selfLevel+1;
   //获取下级联动的combox对象
     var nextComboxObj = Ext.getCmp(this.comboxIds[nextLevel]);
   //获取下级联动数据
     var nextComboxData = this.getComboxData(selfComboxValue,nextLevel);
   //设置下级combox的活性 为 true , 
     nextComboxObj.enable();
   //清除下级combox中的数据
     nextComboxObj.clearValue();
   //初始化下级combox数据
     nextComboxObj.initialConfig.store.loadData(nextComboxData);
    //如果data只有一个,那么将数据设入combox
     if(nextComboxData.length==1) {
         nextComboxObj.setValue(nextComboxData[0][this.valueField[nextLevel]]);    
     }
   //设置更下级的combox活性 为disable ,并清空它们的数据
     for(var i=selfLevel+2;i<this.comboxIds.length;i++){
     var comboxObj = Ext.getCmp(this.comboxIds[i]);
     comboxObj.clearValue(); 
     comboxObj.initialConfig.store.loadData([]);
     //不用下面这种设置disable方清空数据，采用重新导入空数据达到清空数据目的
     //Ext.getCmp(this.comboxIds[i]).setDisabled(true);
     }
   //判断此时下级combox是否有数据，若有数据则直接进入下下级combox联动
     if((value = nextComboxObj.getValue())!=""){
         this.initNextLevelData(value,nextLevel);
     }
  
 },
 /*
  *获取联动Combox初始数据
  *@param value 需要得到数据的Combox的上级Combox的值
  *@param level 需要得到数据的Combox的级别
 */
 getComboxData:function(value,level){
    alert(level);
  var DwrReturnData;
  DWREngine.setAsync(false);
  if(level==0) {//返回省数据
      CityDao.queryCityAll(function(data){
    DwrReturnData = data; 
                   });
  }else if(level==1) {//返回市数据
      CityDao.queryCityAll(function(data){
    DwrReturnData = data;       
                                               });
  }else if(level==2){//返回县数据
      CityDao.queryCountyByCityId(value,function(data){
    DwrReturnData = data;        
              });
  }else if(level==3){//返回客户经理数据
   ClientManagerInterviewDAO.queryClientManagerByCondition(value,function(data){
    DwrReturnData = data;               
                  });
  }else if(level==4){//返回集团数据
      ClientManagerInterviewDAO.queryGrpByClientManager(value,function(data){
    DwrReturnData = data;               
                    });
  }
   DWREngine.setAsync(true);
   return DwrReturnData;
        
 },
 /*添加选择的监听器
  *@param comboxId 需要添加监听器的combox的Id
  *@param comboxLevel 需要添加监听器的combox的级别
 */
 addSelectListener : function(comboxId,comboxLevel,selectCallFun){
    var comboxObj = Ext.getCmp(comboxId);
    comboxObj.addListener("select",function(combox,value){
   selectCallFun.initNextLevelData(combox.getValue(),comboxLevel);
          },comboxObj,{});
   
 }
}

/*如何使用封装的级联菜单*/

function CusManVisMsgCascadeMenu(){
 CusManVisMsgCascadeMenu.superclass.constructor.call(this);
 /*必须覆盖的两个属性*/
 this.comboxIds = ["","city_pv","county_pv","csm_pv","bloc_pv"];
 this.valueField = ["CITY_ID","CITY_ID","COUNTY_ID","CUST_MANA_ID"];
 this.comboxLevel = [0,1,2,3,4];
}

Ext.extend(CusManVisMsgCascadeMenu,CasCadeMenu,{
     /*可填写需要覆盖的或者私有方法*/
     tostring : function(){alert("tostring")}
}); 
var CusManVisMsgCascadeMenuIns = new CusManVisMsgCascadeMenu();

Ext.onReady(function(){
  CusManVisMsgCascadeMenuIns.initCasCadeMenuOnLoad();   
      });