如何在选择标签中为json响应对象提供复选框？答案

【问题标题】：how to give check boxes for json response objects in select tag?如何在选择标签中为json响应对象提供复选框？
【发布时间】：2015-07-20 12:33:50
【问题描述】：

<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 插件。请任何人帮我解决它。

我正在使用弹簧休眠框架。当我使用静态数据时，它可以正常工作，但是当我使用动态数据时，它就不起作用了。

【问题讨论】：

标签： ajax json html thymeleaf

【解决方案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>

【讨论】：