如何使用jQuery和jsp生成动态下拉列表？
我有一个类型A的列表，其中每个元素包含另一个类型B的列表。我想创建一个表单，当用户从包含值A的下拉列表中选择一个值时，另一个下拉列表将填充基于值的值在选定项目的类型B列表上。我是jQuery的新手，但我知道使用jQuery而不是纯jsp来做这个很方便。 请简要介绍一下我需要遵循的步骤来完成这项工作。
JSP只是一种服务器端视图技术。 它不与jQuery竞争。 您可以完美地继续使用JSP。 但我知道你想使用ajaxical技术而不是同步请求来发出异步请求。 这在JSP中也没问题。
首先，我们需要在JSP中有两个下拉列表：
然后我们需要将一些jQuery附加到change事件，以便它根据第一个下拉列表的值填充第二个下拉列表。 将以下内容添加到JSP中的或通过JSP中的加载的外部脚本：
$(document).ready(function() { $('#dropdown1').change(function() { var selectedValue = $(this).val(); var servletUrl = 'dropdown2options?value=' + selectedValue; $.getJSON(servletUrl, function(options) { var dropdown2 = $('#dropdown2'); $('>option', dropdown2).remove(); // Clean old options first. if (options) { $.each(opts, function(key, value) { dropdown2.append($('').val(key).text(value)); }); } else { dropdown2.append($('').text("Please select dropdown1")); } }); }); });
在/dropdown2options的url-pattern后面的servlet中，只返回选项映射为JSON 。 你可以使用Gson 。
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String selectedValue = request.getParameter("value"); Map options = optionDAO.find(selectedValue); String json = new Gson().toJson(options); response.setContentType("application/json"); response.setCharacterEncoding("UTF-8"); response.getWriter().write(json); }
这基本上都是。
我在这里回答了关于链接选择器的类似问题…我不知道jsp，但是这个jQuery版本应该给你一个想法。