如何在select标签中给出json响应对象的复选框？

Question

<script>
$(document).ready(function() {  
      $('#state').change(function(event) {
       var $c=$("#state").val();
       $.get('getCities',{id:$c},function(responseJson) {
           var $select = $("#city");                           
           $select.find('option').remove();
           $.each(responseJson, function(key, value) { 
               $('<option ></option>').val(key).text(value).appendTo($select);                   
           });
        });
    });
});       

</script>

<form action="postingRequirementSaving" th:object="${PostRequirementCommand}">

        <label>State:</label> 
        <select th:field="*{stateid}" id="state">
            <option value="0" selected="selected">&ndash; Select an option &ndash;</option>
            <option th:each="var :${state}" th:value="${var.stateid}" th:text="${var.statename}"></option>
        </select> <span class="error"></span>

        <label>City:</label>
        <select th:field="*{city}">
            <option value="0">Select City</option>
        </select>
</form>

Json响应不支持多个选择jquery插件。请任何人能帮我解决这个问题。

我使用的是spring hibernate框架。当我使用静态数据时，它工作得很好，但当我使用动态数据时，它就不能工作了。

Answer 1

如果您使用的是插件，则必须在加载响应后初始化选择字段。

例如，如果您使用此插件：

 <script src="jquery.multiple.select.js"></script>

在收到jsonResponse后，您必须初始化您的城市选择器。此外，在上面的代码中，您必须向选择器添加一个id。

<script>
$(document).ready(function() {  
  $('#state').change(function(event) {
   var $c=$("#state").val();
   $.get('getCities',{id:$c},function(responseJson) {
       var $select = $("#city");                           
       $select.find('option').remove();
       $.each(responseJson, function(key, value) { 
           $('<option ></option>').val(key).text(value).appendTo($select);                   
       });
       $select.multipleSelect();
    });
});
});
</script>