簡體   English   中英

如何獲取 java 列表並在 jsp 頁面中構建下拉列表

[英]How to get java list and built a drop down list in jsp page

我有一個 jsp 頁面。 如果用戶輸入某個文本,則會發送 ajax 請求並檢索列表。Bow 我想從列表 object 中構建一個下拉列表,並將默認值設置為列表 Z4970317944114A5524BZ5B66Z 的第一個元素。 我怎么能做到這一點。

You need to encode the list on the Java side (as JSON, maybe, or using some custom separators) and then use JavaScript in your onSuccess callback to add options to your select box based on the encoded values.

我沒有任何 AJAX 知識,所以我對此無能為力。 所以我解決這個問題的方法是在 java/jsp 中盡我所能,然后使用 javascript/AJAX 從輔助 jsp 中獲取 select,如下所示:

<%@ 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>使用輔助變量來計算選項(在 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>

你可以使用這樣的東西來 select 第一個元素:

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

I recommend to use a servlet to handle the ajax request, to use JSON as data transfer format and to use jQuery to do the real ajax request and to traverse and manipulate the HTML DOM tree. 您可以在 如何使用 Servlets 和 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);
    }

}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM