JSP 中的依赖下拉列表

Dependent Drop Down List in jsp

本文关键字：下拉列表 依赖 JSP      更新时间：2023-09-26

我的JSP中有两个下拉列表。一个用于顶级类别，另一个用于子类别。当我的JSP页面最初加载时，它将只包含第一个下拉框中的topcategories列表，第二个下拉列表将为空。当我从第一个下拉列表中选择topcategory时，其相应的子类别应填充在第二个下拉列表中。在我最初加载 jsp 本身期间，我将获得包含顶级类别和子类别列表的数据 bean。因此，当选择topcategory时，我应该选择topcategory的值，并且我必须将其与databean中存在的topcategory列表进行比较，并且需要在第二个下拉列表中填充相应的子类别。如何做到这一点，请帮助我。提前谢谢。我已经分享了我的代码以供参考。

<div class="selectbox01">
                <select name="make" id="make" onchange="loadModel()">
                    <c:forEach var="topCategory" items="${catalog.topCategories}" varStatus="status">
                    <option selected="selected"></option>
                    <option value="${topCategory.categoryId}"><c:out value="${topCategory.description.name}"/></option>
                    </c:forEach>
                </select>
            </div>
            <c:set var="make" value="${WCParam.make}"/>
            <div class="selectbox01">
                <select name="model" id="model">
                <option selected="selected"></option>
                <c:forEach var="topCategory" items="${catalog.topCategories}" varStatus="status">
                <c:if test="${topCategory.categoryId == make}">
                <c:forEach var="subTopCategory" items="${topCategory.subCategories}" varStatus="status2"> 
                    <option value="${subTopCategory.categoryId}">
<c:out value="${subTopCategory.description.name}"/></option>
                   </c:forEach>
                   </c:if>
                     </c:forEach>
                </select>
            </div>

一种方法是创建一个表示"catalog"bean的javascript对象。然后编写一个绑定到 topcategory 下拉列表的 onchange 处理程序，该处理程序使用 javascript 中的"catalog"对象来获取子类别的 javascript 数组。

将其分解为步骤：

第 1 步：创建一个表示"目录"bean的javascript对象：一个简单的方法是覆盖目录 bean 的 toString（） 方法，并返回一个表示 bean 的 JSON 对象。或者使用 Jackson api 将目录对象转换为 JSON 字符串。完成后，它将 json 保存在 javascript 变量中。例如，在您的JSP中写下以下内容：

<script type="text/javascript"> var catalogJson = ${catalog};</script>

第 2 步：在javascript中编写loadModel函数，该函数使用"catalogJson"变量来获取子类别并将它们填充到另一个下拉列表中。

我已经删除了一些细节，但我想大部分都是直截了当的。

相关文章：