title: how to pass list from javascript to spring controller
body: <p>I have issue of how can javaScript can pass two sepparate lists to spring controller. On my freeMarker template I made option to change set of two lists. 
  This is render of two lists:</p>
  
  <p>EDITED: I found that Jquery have Ui plagin with </p>
  
  <pre><code>.sortable("toArray", { key: "id" }) 
  </code></pre>
  
  <p>method, so I added Id value to &lt; li> tag</p>
  
  <pre><code>&lt;div class="span5" id="listBox"&gt;
              &lt;h3&gt;Assigned Servers&lt;/h3&gt;
              &lt;#if assignedServers?has_content&gt;
                  &lt;ul id="sortable1" class="connectedSortable"&gt;
                      &lt;#list assignedServers as responsible &gt;
                          &lt;li class="ui-state-default"
                              id="${responsible.id}" &gt;${responsible.server_name}&lt;/li&gt;
                      &lt;/#list&gt;
                  &lt;/ul&gt;
              &lt;#else&gt;
                  &lt;h4&gt;This employee have no assigned servers yet.&lt;/h4&gt;
              &lt;/#if&gt;
          &lt;/div&gt;
  
          &lt;div class="span5" id="listBox"&gt;
              &lt;h3&gt;Available Servers&lt;/h3&gt;
              &lt;#if availableServers?has_content&gt;
                  &lt;ul id="sortable2" class="connectedSortable"&gt;
                      &lt;#list availableServers as available &gt;
                          &lt;li class="ui-state-default"
                              id="${available.id}" &gt;${available.server_name}&lt;/li&gt;
                      &lt;/#list&gt;
                  &lt;/ul&gt;
              &lt;#else&gt;
                  &lt;h4&gt;There is no available servers to assign.&lt;/h4&gt;
              &lt;/#if&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>EDITED: I changed JQuery function:</p>
  
  <pre><code>&lt;script&gt;
          $(function() {
              var assigned = "";
              var available = "";
  
              $('#sortable1').sortable({
                  connectWith: '#sortable2',
                  update: function(event, ui) {
                      assigned = $(this).sortable("toArray", { key: "id" });
                      }
              }).disableSelection();
  
              $('#sortable2').sortable({
                  connectWith: '#sortable1',
                  update: function(event, ui) {
                      available = $(this).sortable("toArray", { key: "id" });
                      }
              }).disableSelection();
  
              $('#assign').click(function(){
                  $.ajax({
                      type: "POST",
                      url: "/ServerMonitoring/employee_management/serv_assignment/2",
                      data: JSON.stringify({
                           serversListModel: {
                               "assignedServers": assigned,
                               "availableServers": available
                           }
                       }),
                      datatype: "jsondata",
                      contentType: 'application/json',
                      success: function(data) {
                          alert("Success");
                      },
                      error: function (e) {
                          alert("Error: " + e);
                      }
                  });
                  return false;
              });
              //debugger
          });
      &lt;/script&gt;
  </code></pre>
  
  <p>EDITED: this is my new spring controller:</p>
  
  <pre><code>@RequestMapping(value = "/{id}", method = RequestMethod.POST)
  public @ResponseBody ModelAndView onSubmit(
          @ModelAttribute("serversListModel") ServersListModel serversListModel,
          @PathVariable("id") Long responsibleId,
          BindingResult result,
          HttpServletRequest request,
          HttpServletResponse response,
          SessionStatus status) throws ParseException {
  
      if (!result.hasErrors()) {
          if (serversListModel.getAvailableServers() != null) {
              for (String id : serversListModel.getAvailableServers()) {
                  ServerEntity entity = employeeService.getServerById((long)Integer.parseInt(id));
                  entity.setResponsible(responsibleId);
                  adminService.updateServer(entity);
              }
          }
  
          if (serversListModel.getAssignedServers() != null) {
              for (String id : serversListModel.getAssignedServers()) {
                  ServerEntity entity = employeeService.getServerById((long)Integer.parseInt(id));
                  entity.setResponsible((long) 0);
                  adminService.updateServer(entity);
              }
          }
          status.setComplete();
          return new ModelAndView("redirect:/employee_management/employee_manager");
  
  
      } else {
          response.setStatus(HttpServletResponse.SC_BAD_REQUEST);
          return new ModelAndView("redirect:/employee_management/serv_assignment");
      }
  
  }
  </code></pre>
  
  <p>EDITED: new ServersListModel - it's a simple POJO with two vars</p>
  
  <pre><code>public class ServersListModel {
  
  private List&lt;String&gt; assignedServers;
  
  private List&lt;String&gt; availableServers;
  ...
  }
  </code></pre>
  
  <p>By debuging in FireBug ican se that JSON is passing String:</p>
  
  <pre><code>{"serversListModel":{"assignedServers":["2","4"],"availableServers":["1","5","3","6","7","8"]}}
  </code></pre>
  
  <p>But, I still didn't manage to resive that string, vars in my model stil contain NULL on debuging. 
  Placing @RequestBody anotation on place of @ModelAttribute("serversListModel") makes Jquery throw BadRequest error.
  If, inside the method body, I call </p>
  
  <pre><code>String jsonBody = IOUtils.toString(request.getInputStream());
  </code></pre>
  
  <p>it will return JSON String object with requerd id, so i'm reaky near to answer.</p>
  
  <p>Please help me to find out the mistake in Controller. Thank you.</p>