我想问一个问题
我想在一个JSP页面中显示3个下拉列表,
其中第二个下拉列表基于第一个下拉列表中的选定值
依旧......
根据我的有限知识,当用户从下拉列表中选择一个值时,
用户需要单击按钮将值传递给服务器端。
像这样:<form action="second_drop.jsp">
<select name="drop">
...
</select>
<input type="submit" value="Submit" />
</form>
现在,我想问一个问题,
是否可以在不单击按钮的情况下传递下拉列表值?
也就是说,当用户从下拉列表中选择一个值时,
所选值可以自动传递到服务器端,而无需单击“提交”按钮。
然后服务器将根据所选值显示第二个下拉列表
感谢您的帮助。
答案 0 :(得分:5)
绝对有可能使用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>
$(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>
s:<option value="val1">Option 1</option>
<option value="val2">Option 2</option>
<option value="val3">Option 3</option>
那里有很多,如果你不熟悉JavaScript和/或jQuery,那么只要问你是否有任何你不理解的东西。
答案 1 :(得分:0)
这是可能的,并且有时与地址下拉列表一起使用,例如选择一个国家/地区,然后填充州/省的列表,以及航班,例如选择出发机场,并筛选可能的目的地列表。
要做到这一点,您需要客户端Javascript。您需要连接onchange事件,以便它将提交表单(或向另一个页面发出请求)与服务器进行通信以获取新列表。
e.g。 (虽然你需要设置一个隐藏的字段来说“这是一个下拉刷新,而不是”我已完成输入我的数据“提交)
<form>
<select name="drop" onchange="this.form.submit()">
...
</select>
</form>
您可能希望阅读JSP: drop down list 2 depends on drop down list 1的答案 - 有多种方法可以做到这一点,这取决于您需要做什么。