javaScript實現表單聯動

   在接受到action的請求後，在後臺首先查出連個集合，比如  所有的部門，所有的人員

   List<UserInfoVO> users = userInfoFacede.getAllUsers();
   request.setAttribute("users", users);   //把值傳給表單

   List<DeptVO> dept = userInfoFacede.getAllDeptName();
   request.setAttribute("dept", dept);

 

 

   在jsp頁面

寫在<script type="text/javascript"></script>

 

   var onecount;
    onecount=0;
    subcat=new Array();
         
          <logic:iterate id="small" name="users" indexId="index">
                  subcat[${index}] = new Array("${small.username}","${small.deptid}","${small.userid}");
          </logic:iterate>
    onecount=${index+1};
   
    function changelocation(locationid){
          document.forms[0].areaid.options[0]=new Option("-請選擇-","");
                document.forms[0].areaid.length = 1;

                var locationid=locationid;
                var i;
          for (i=0;i < onecount; i++) {
            if (subcat[i][1] == locationid)
             {
                  document.forms[0].areaid.options[document.forms[0].areaid.length] = new Option(subcat[i][0], subcat[i][2]);
                  //取到部門的ID和姓名  分別和數組對應
             }        
          }
           
    }

 

分別與之對應

      <td align="right" bgcolor="#eeeeee">
         所屬部門：
        </td>
        <td>
           <select name="rootid" id="rootid"
          οnchange="changelocation(document.forms[0].rootid.options[document.forms[0].rootid.selectedIndex].value)">
          <option value="" selected>
           --請選擇--
          </option>
          <logic:iterate id="big" name="dept">
           <option value="${big.pid }">
            ${big.deptname }
           </option>
          </logic:iterate>
         </select>
        </td>

 

         <td width="15%" align="right" bgcolor="#eeeeee">
         任務負責人：
        </td>
        <td width="30%">
         <select name="areaid" id="areaid">
          <option value="" selected>
           --請選擇--
          </option>
         </select>
        </td>

 

 

這樣就可以實現選擇任意一個部門就可以得到部門的所有成員了~~~~~~~~~