jsp中相互关联的动态选择框

dynamic select boxes related to one other in jsp

本文关键字:动态 选择 关联 jsp      更新时间:2023-09-26

我有两个列表,如部门和经理,我把这两个在请求范围。现在我想在选择框中显示两个列表,这样当用户选择一个部门时,对应的经理应该默认出现在下一个选择框中。如果我想更改管理器,我可以选择其他的并保存。

我的jsp是这样的。第一个包含部门的选择框。

<select id="dname" name="Name" onchange="autoPopulateModifydept();">
       <option value="">-Select</option>
       <c:forEach var="departmentList" items="${departmentList}">
           <option value='${departmentList.getDepartment()}@${departmentList.getId()}'>${departmentList.getDepartment()}</option>
       </c:forEach>
</select>

第二个包含managerlist的选择框。

<select  id="deptHead" name="deptHead" onchange="autoPopulatedeptHead();">
       <option value="">-Select-</option>
            <c:forEach var="projectmanager" items="${projectManagerList}">
            <option value='${projectmanager.getProjectManagerName()}@${projectmanager.getPmId()}'>${projectmanager.getProjectManagerName()}</option>
            </c:forEach>
</select>

这里department中的getId和manager中的getPmId是相同的。基于此,我想链接两个选择框。怎么做呢

这可以使用javascript完成,请参阅下面的示例示例。在改变第一个列表的选择时调用这个方法,并将第一个列表的选择值与第二个列表的选择值进行比较,并使第二个列表与第一个列表的Id值匹配。

function changeMangerId(){ 
var emplId =document.getElementById("firstList").value;
<c:forEach var="paramObj"
    items="${managerList}]
var managerIdId= '<c:out value="${Id}"/>';
             if(emplId)!= null && (emplId)!= '' && trim(emplId)=== trimm(anagerIdId) {
                 $("#SecondListId option[value='"+ managerIdId +"']").attr("selected", "selected");
          }
</c:forEach>
}