Question

根据第一个下拉列表项目选择，我想要第二个下拉列表应包含相关内容。我怎么能在java中这样做？例如，假设，第一个下拉列表包含国家/地区名称，第二个下拉列表包含州名称。如果我选择一个特定的国家，比如“印度”，从第一个下拉列表中命名，那么第二个列表应该只显示国家的相关状态，即“印度”的状态。这两个清单都是动态的。

Answer 1

这比Java和struts 2更多Javascript。

有两个选项可以获得一个地图，其中第一个下拉值为关键值，另一个下拉列表的值与该项目相关。

然后，当选择第一个组合框的值时，您可以从javascript地图中获取值并将其设置为第二个下拉列表。

其他选项是在第一个下拉列表的选择中发送ajax请求，并从结果中剔除第二个下拉列表。

Answer 2

我建议使用javascript：

使用ajax，通过执行返回选项的struts操作，然后重新加载select内容，例如使用jquery：

$("#stateSelect").load('http://host/myStateAction.do?country=' + country);
或在页面加载时加载整个国家/地区映射，并使用纯javascript更新第二个列表而不调用服务器。为此，您可以在每个国家/地区option存储一个data-states属性，其中包含相应的状态。

<option value="code" data-states="state1,state2,state3">countryName</option>

否则，如果你想避免使用javascript，你可以在触发更改事件时提交表单，在服务器端（struts action）根据第一个列表的值填充第二个列表，然后重定向到表单页。 <select onchange="documents.forms['myForm'].submit()">

Answer 3

你必须使用如下所示的JavaScript：
这比处理java更好：

以下是您的示例HTML文件：

<select id="country" name="country" aria-required="true" class="required">
    <option value="">Select Your Country</option>
    <option value="USA">India</option>
    <option value="CA">Pakisthan</option>
</select>
<p><label for="state">Select Your State<span title="required">*</span>
</label></p>
<select id="state" name="state" aria-required="true" class="required">
    <option value="" selected="">Select Your State</option>
    <optgroup label="India">
        <option value="WB">West Bengal</option>
        <option value="BH">Bihar</option>        
    </optgroup>
    <optgroup label="Pakisthan">
        <option value="LH">Lahore</option>
        <option value="IB">Islamabad</option>
    </optgroup>
</select>

以下是您的示例JavaScript：

var stateVar = $('#state option, #state optgroup');
stateVar.hide();
$('#country').change(function () {
    stateVar.hide();
    $("#state optgroup[label='" + $(this).find(':selected').html() + "']")
        .children()
        .andSelf()
        .show();
});

你也可以使用AJAX，它可能有点复杂，所以最好使用简单的JavaScript 您可以尝试这种方法，如果有任何疑虑，请告诉我。

根据第一个下拉列表选择，第二个下拉列表应包含相关内容

3 个答案: