【问题标题】:Depending on first drop list selection, second drop down list should contain related contents根据第一个下拉列表选择,第二个下拉列表应包含相关内容
【发布时间】:2013-04-05 09:09:14
【问题描述】:

根据第一个下拉列表项选择,我希望第二个下拉列表应包含相关内容。我怎么能在java中做到这一点? 例如, 假设第一个下拉列表包含国家名称,第二个下拉列表包含州名称。如果我选择一个特定的国家,比如“印度”,从第一个下拉列表中选择名称,那么第二个列表应该只显示国家的相关状态,即“印度”的状态。 而且这两个列表都是动态的。

【问题讨论】:

  • 你说的是swing组件还是HTML组件?
  • Struts2中有<s:doubleselect>标签。
  • @Sudhanshu,我必须在 JSP 页面上显示。
  • @Anand Shankar,我如何在 java 脚本中从数据库中获取县值和州值?

标签: java struts2


【解决方案1】:

这比 Java 和 struts 2 更像 Javascript。

您可以通过两个选项获取 Map,其中第一个下拉列表的值作为键,另一个下拉列表的值与该项目相关。

Then when the first combobox's value is selected you can get the values form the javascript map and set it to the second dropdown.

其他选项是在第一个下拉列表的选择上发送一个 ajax 请求,并从结果中填充第二个下拉列表。

【讨论】:

    【解决方案2】:

    你必须像下面这样使用 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】:

      我建议为此使用 javascript:

      • 使用 ajax,通过创建一个返回选项的 struts 操作,并重新加载您的 select 内容,例如使用 jquery:

        $("#stateSelect").load('http://host/myStateAction.do?country=' + country);

      • 或在页面加载时加载整个国家/地区映射,并使用纯 JavaScript 更新第二个列表,无需服务器调用。为此,您可以例如在每个国家/地区存储 option 一个 data-states 属性,包含相应的州。

      &lt;option value="code" data-states="state1,state2,state3"&gt;countryName&lt;/option&gt;

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

      【讨论】:

        猜你喜欢
        • 2012-01-04
        • 2018-09-21
        • 2017-12-17
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2018-09-28
        • 1970-01-01
        相关资源
        最近更新 更多