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

Question

I have a jsp page. if a user enters a certain text a ajax request is sent and and List is retrieved.Bow i want to built a drop down list from the List object and set the default value to the first element of the List Object. How I can do this.

score 0 · Answer 1 · answered Jun 06 '11 at 10:26

0

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.

answered Jun 06 '11 at 10:26

Costi Ciudatu

37,042
7
56
92

sergio91pt · Accepted Answer · 2011-06-06T11:44:00.940

I don't have any AJAX knowledge so I cant help on that end. So my way of solving this would be doing the most I can in java/jsp's and then using javascript/AJAX to fetch the select from an auxiliary jsp like this:

<%@ 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>

Edit: Actually would be cleaner to build the menu first just with <c:forEach> using an auxiliary var to numerate the options (in the id field), then use javacript to turn on the selected attribute to the first one. Like this:

<%@ 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>

And you can use something like this to select the first element:

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

score 0 · Answer 3 · edited May 23 '17 at 11:48

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. You can find a lot of examples in How to use Servlets and Ajax? Your particular case can be solved as follows:

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 (using Google Gson to convert Java objects to JSON string):

@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);
    }

}

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

3 Answers3