How to populate drop down values using servlet response

Question

I am able to have the response from a servlet and also able to show it on jsp page, but if I try to populate the same in a drop down, i am not able to-

Servlet code

String sql = "SELECT records from department";
ResultSet rs = s.executeQuery(sql);
Map<String, String> options = new LinkedHashMap<String, String>();

while (rs.next()) {
  options.put(rs.getString("records"),rs.getString("records"));
}
String json = new Gson().toJson(options);
response.setContentType("application/json");
response.setCharacterEncoding("UTF-8");
response.getWriter().write(json);

JSP code---

JS code

<script type="text/javascript">
$(document).ready(function () {                           // When the HTML DOM is ready loading, then execute the following function...
    $('.btn-click').click(function () {                  // Locate HTML DOM element with ID "somebutton" and assign the following function to its "click" event...
        $.get('/testservlet', function (responseJson) {    // Execute Ajax GET request on URL of "someservlet" and execute the following function with Ajax response JSON...
            //alert(responseJson);
            var $select = $('#maindiv');                           // Locate HTML DOM element with ID "someselect".
            $select.find('option').remove();                          // Find all child elements with tag name "option" and remove them (just to prevent duplicate options when button is pressed again).
            $.each(responseJson, function (key, value) {               // Iterate over the JSON object.
                $('<option>').val(key).text(value).appendTo($select); // Create HTML <option> element, set its value with currently iterated key and its text content with currently iterated item and finally append it to the <select>.
            });
        });
    });
});
</script>

HTML Code--

<input type="button" class="btn-click" id="best" value="check"/>
<div id="maindiv" style="display: block"></div>

If I create a <ul> and <li> I can have the data from the response on my page but not able to create the select options? Any help on this would be great.

score 1 · Accepted Answer · edited May 23 '17 at 11:57

1

Try it again after removing beginning /.

$.get('testservlet', function (responseJson)

The JSON string is not in proper way. It should be something like this. Why are you using JSON string here whereas you are passing only records as key as well as value.

Simply return a comma separated string from Servlet and split it jQuery.

Find example here for Iterating a comma separated string

Sample code:

var items = responseJson.split(',');

for ( var i = 0; i < items.length; i++) {
    $('<option>').val(items[i]).text(items[i]).appendTo($select); 
}

edited May 23 '17 at 11:57

Community

1
1

answered Jun 08 '14 at 17:45

Braj

46,415
5
60
76

Thanks Braj. But I am following BalusC suggestion from [here](http://stackoverflow.com/a/4113258/2480307). It should work in the map case as well, in the way I am doing? – AKIWEB Jun 08 '14 at 18:04
You have to modify your JSON string. I have shared you some links. Have you looked any one. – Braj Jun 08 '14 at 18:07
1

Yes,that's another way of doing following to do that way :) Thanks for sharing – AKIWEB Jun 08 '14 at 18:11
If you think to make my post more helpful for others then you are free to modify my post. – Braj Jun 08 '14 at 18:14
Sure Will update :) also I have figured out why my earlier code was not working. It was a silly html error, I had to add ` – AKIWEB Jun 08 '14 at 18:23

How to populate drop down values using servlet response

1 Answers1