非 ajax级联下拉框

1. 以总公司, 分公司为例   
2. 1.首先定义一个javascript对象 用于存储你要级联的那些数据   

   function subCompany(parentID, companyID, name) {   
       this.parentID = parentID; //总公司ID   
       this.companyID = companyID; //分公司ID  下拉框的value   
       this.name = name;           //分公司名   下拉框的text   
   }

       
3.   
4. 2.然后定义一个javascript 数组来存放上面的对象  

   var subCompanys = new Array();  

    
5. 3.接下来要将你从后台传来的数据 放到数组里   
6. 我这里是用jstl + el

   这段代码要写在js标签里
   <c:forEach var="subCompany"  items="${formCommand.subCompanyCollection}">   
              subCompanys.push(new subCompany(
                     "<c:out  value="${subCompany.parentID}"/>", 
                     "<c:out value="${subCompany.sid}" />",
                     "<c:out value="${subCompany.name}" />"));   
   </c:forEach> 

     
7.  
8. 4. 再接下来 是当 总公司下拉框值变化时 触发的事件  

   function companyChangeEdit(obj) {
       var parentID = obj.value;
       var subCompanySelect = obj.form.subCompany;// 显示分公司的下拉框
   
      subCompanySelect .options.length = 1;
       for(var i=0; i < subCompanys.length; i++){
           var subCompanyObj = subCompanys[i];
           if(subCompanyObj.parentID == parentID){
               var oTempOption = document.createElement("option");
               oTempOption.text = subCompanyObj.name;
               oTempOption.value = subCompanyObj.companyID;
               subCompanySelect .options[subCompanySelect .options.length] 
                                   = oTempOption;
           }
       }
   
      if(obj.form.parentCompany.selectedIndex == 0){ 
          obj.form.subCompanySelect .selectedIndex = 0;
   		
       }
   }

    
     
9. 还有两个下拉框

   总公司的
   <select  name="parentCompany"
                   onChange="companyChangeEdit(this);">
        <option value="-1">
          请选择总公司 </option>
        <c:forEach var="company"
             items="${formCommand.companyCollection}">
              <option value="<c:out value="${company.sid}" />"
              <c:if test="${company.sid == formCommand.companyId}">selected</c:if>>
               <c:out value="${company.name}" />
              </option>
         </c:forEach>
   </select>
   

      

   分公司的
   <select  name="subCompany">
   
        <option value="-1">
        请选择子公司
        </option>
        <c:forEach var="subCompany"
                 items="${formCommand.currentSubCompanyCollection}">
                <option value="<c:out value="${subCompany.sid}" />"
                <c:if test="${subCompany.sid == formCommand.subCompanyID}">selected</c:if>>
                <c:out value="${subCompany.name}" />
                </option>
        </c:forEach>			
   </select>

    

 嗯  就这些了 总的思想是把所有数据加载到页面上先, 然后在由javascript 来负责显示

没有用ajax  项目要求(经理的)

 

还有一种方法是 隐藏的iframe 我没有那么作 因为还要写个页面 我觉得不爽
希望大家有什么好方法拿出来讨论啊  我就会这么多 还是个菜鸟啊