JSP下拉列表问题

Question

我想问一个问题

我想在一个JSP页面中显示3个下拉列表，

其中第二个下拉列表基于第一个下拉列表中的选定值，

依此类推...

根据我的有限据了解，当用户从下拉列表中选择一个值时，

用户需要单击一个按钮将该值传递到服务器端。

像这样：

<form action="second_drop.jsp">
   <select name="drop">
    ...
   </select>
   <input type="submit" value="Submit" />
</form>

现在，我想问一个问题，

是否可以在不单击按钮的情况下传递下拉列表值？

也就是说，当用户从下拉列表中选择一个值时，

所选值可以自动传递到服务器端，而无需单击提交按钮。

然后服务器将根据所选值显示第二个下拉列表，

感谢您的帮助。

Answer 1

使用 ajax 的神秘力量绝对可以做到这一点！您正在寻找的这种特殊行为称为“链接下拉菜单”或“依赖下拉菜单”。以下是我使用 jQuery 的方法，大量评论，因此（希望）很清楚：

标记

<form action="second_drop.jsp">
   <select id="first_drop" name="drop">
    ...
   </select>
   <select id="second_drop" disabled="disabled"></select>
   <input type="submit" value="Submit" />
</form>

JavaScript

$(function () // run the following code when the DOM is ready
{
    $('#first_drop') // equivalent to document.getElementById('first_drop')
        .change(function () // run the following code whenever the DDL value changes
        {
            var val = $(this).val(); // get the new value of the first DDL
            $('#second_drop').load(
              'second_drop.jsp', // this is the URL to load
              {drop: val} // pass this data to the server with the request
              function () // execute this function when the response comes back
              {
                  $('#this').attr('disabled', false); // enable the 2nd DDL
              });
        });
});

second_drop。 jsp 应该以 列表进行响应：

<option value="val1">Option 1</option>
<option value="val2">Option 2</option>
<option value="val3">Option 3</option>

如果您不熟悉 JavaScript 和/或 jQuery，这里有很多内容，所以只需询问是否有您不熟悉的内容不明白。

使用 jQuery 函数

• $()，简写为 $(document).ready()
• $()，选择器函数
• .change()
• .val()
• .load()
• .attr()

Answer 2

这是可能的，有时与地址下拉列表一起使用，例如选择一个国家，然后填充州/省的列表，也与航班一起使用，例如选择出发机场，然后过滤可能的目的地列表。

为此，您需要客户端 Javascript。您需要连接 onchange 事件，以便它提交表单（或向另一个页面发出请求）以与服务器进行通信以获取新列表。

例如（尽管您可能需要设置一个隐藏字段来表示“这是下拉刷新，而不是“我已完成输入数据”提交）

<form>
<select name="drop" onchange="this.form.submit()">
...
</select>
</form>

您可能想阅读 JSP：下拉列表 2 取决于下拉列表 1 - 那里有多种方法可以做到这一点，这取决于您需要做什么。