Question

My task is to populate another select list based on what is choosen from one select list, querying populating data from database.

I think it goes something like:

1. User clicks the parent selectlist which returns the id of the selected item.
2. On select list onChange method a query like select id, description from table where child_id=_id_ is executed.
3. Child select list is populated based on that query. Maybe the result of query is returned in a controller method?

My problem is that I don’t seem to find an example that would suit Spring 3 applications. There are multiple examples with php, and I’m newbie with JQuery.

Answer 1

I would like to recommend you to use Google, because simple search will provide you the answer.

This code sample will show you the way how to do it:

<script type="text/javascript" charset="utf-8">
$(function(){
  $("select#category").change(function(){
    $.getJSON("/getSubCategories?id="+$(this).val(), function(j){
      var options = '';
      for (var i = 0; i < j.length; i++) {
        options += '<option value="' + j[i].optionValue + '">' + j[i].optionDisplay + '</option>';
      }
      $("select#subCategory").html(options);
    })
  })
})
</script>

Now the Server side:

@RequestMapping(method = RequestMethod.GET, value = "/getSubCategories")
@ResponseBody
public String handleRequest( @RequestParam("id") int id) {) {
now build your json string as optionValue and OptionDisplay.
String json = service.getSubCategories(id);
 return json;
}