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

Question

我有两个列表，例如部门和经理，我将这两个列表放在请求范围内。现在我想在选择框中显示两个列表，这样当用户选择一个部门时，相应的经理应该默认出现在下一个选择框中。如果我想更换经理，我可以选择任何其他并保存。

我的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>

具有管理器列表的第二个选择框。

<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>

这里部门中的 getId 和经理中的 getPmId 是相同的。基于此，我想链接两个选择框。怎么做。

Answer 1

这可以使用 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>
}