如何在jsp页面中获取java列表并建立一个下拉列表答案

【问题标题】：How to get java list and built a drop down list in jsp page如何在jsp页面中获取java列表并建立一个下拉列表
【发布时间】：2011-06-06 10:21:29
【问题描述】：

我有一个 jsp 页面。如果用户输入某个文本，则会发送 ajax 请求并检索 List。Bow 我想从 List 对象构建一个下拉列表并将默认值设置为 List 对象的第一个元素。我该怎么做。

【问题讨论】：

标签： java javascript ajax jsp

【解决方案1】：

我没有任何 AJAX 知识，所以对此我无能为力。所以我解决这个问题的方法是在 java/jsp 中尽我所能，然后使用 javascript/AJAX 从辅助 jsp 中获取选择，如下所示：

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<select>
    <c:set var="seenFirst" value="0" />
    <c:forEach var="obj" items="${sessionScope.list}">
        <c:choose>
            <c:when test="${seenFirst == 0}">
                <c:set var="seenFirst" value="1" />
                <option value="${obj}" selected>${obj}</option>         
            </c:when>

            <c:otherwise>
                <option value="${obj}">${obj}</option>
            </c:otherwise>
        </c:choose>
    </c:forEach>
</select>

编辑： 实际上，首先使用 <c:forEach> 使用辅助 var 来计算选项（在 id 字段中），然后使用 javacript 将所选属性打开到第一个，实际上会更干净。像这样：

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<select>
    <c:set var="n" value="0" />
    <c:forEach var="obj" items="${sessionScope.list}">
        <option id="menu-${n}" value="${obj}">${obj}</option>
        <c:set var="n" value="${n + 1}" />
    </c:forEach>
</select>

您可以使用类似这样的方法来选择第一个元素：

var first = document.getElementById('menu-0');
first.selected = true;

【讨论】：

【解决方案2】：

您需要在 Java 端对列表进行编码（可能是 JSON，或者使用一些自定义分隔符），然后在您的 onSuccess 回调中使用 JavaScript 根据编码值将 options 添加到您的选择框中。

【讨论】：

【解决方案3】：

我推荐使用servlet 来处理ajax 请求，使用JSON 作为数据传输格式，使用jQuery 来做真正的ajax 请求并遍历和操作HTML DOM 树。你可以在How to use Servlets and Ajax?找到很多例子你的具体情况可以解决如下：

JSP：

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>SO question 6250627</title>
        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script>
            $(document).ready(function() {
                $('#search').keyup(function() {
                    $.get('search', $(this).serialize(), function(responseText) {
                        var $select = $('#results');
                        $select.find('option').remove();
                        $.each(responseJson, function(key, value) {
                        $('<option>').val(key).text(value).appendTo($select);
                    });
                });
            });
        </script>
    </head>
    <body>
        <form><input id="search" /></form>
        <select id="results"></select>
    </body>
</html>

Servlet（使用Google Gson将Java对象转换为JSON字符串）：

@WebServlet(urlPatterns={"/search"})
public class SearchServlet extends HttpServlet {

    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        Map<String, String> results = someService.find(request.getParameter("search"));
        String json = new Gson().toJson(results);

        response.setContentType("application/json");
        response.setCharacterEncoding("UTF-8");
        response.getWriter().write(json);
    }

}

【讨论】：