Question

我想用ajax绑定我的multiselect但是在ajax调用项目没有显示之后。我尝试重建或刷新multiselect但它仍然没有显示

 <script type="text/javascript">
     $(document).ready(function () {

         var categCheck = $('#multiselect').multiselect({
             includeSelectAllOption: true,
             enableFiltering: true
         });


         $.ajax({
             type: 'GET',
             url: "@Url.Content("~/Home/Listpositions/")",
             success: function (data) {
                 $.each(data.data, function (index, item) {
                     alert(item.PositionName);
                     var opt = $('<option />', {
                         value: item.PID,
                         text: item.PositionName
                     });
                     opt.appendTo(categCheck);

                 });
             }
         });
         $('#multiselect').multiselect('rebuild');
         categCheck.multiselect('rebuild');

         categCheck.multiselect('refresh');
         $("select.multiselect").multiselect("refresh");
   });
        </script>

以下是我的多选页面链接：http://pratikisara.com/Home/Quick

如何从多选JS文件（enter link description here）进行ajax调用，以及在哪个代码块中我应该进行ajax调用？

Answer 1

您需要在AJAX成功函数中进行重建和/或刷新。在您的代码中，进行AJAX调用，然后重建多重选择。但重建可能会在AJAX调用成功之前发生。试试这个：

<script type="text/javascript">
   $(document).ready(function () {

     var categCheck = $('#multiselect').multiselect({
         includeSelectAllOption: true,
         enableFiltering: true
     });


     $.ajax({
         type: 'GET',
         url: "@Url.Content("~/Home/Listpositions/")",
         success: function (data) {
             $.each(data.data, function (index, item) {
                 alert(item.PositionName);
                 var opt = $('<option />', {
                     value: item.PID,
                     text: item.PositionName
                 });
                 opt.appendTo(categCheck);

                 // Rebuild after adding the options!
                 $('#multiselect').multiselect('rebuild');
             });
         }
     });
  });
</script>

Answer 2

通过使用重新加载它的工作罚款给我。 ajax调用中的multiselect（＆＃34; reload＆＃34;）函数刷新复选框列表。

var obj_ddl_ExistingIdea = $("#ddl_ExistingIdea");
        if (response.length > 0) {

            for (var i = 0; i < response.length; i++) {
                var str_newOption = '';
                str_newOption = "<option value='" + response[i].IdeabookId + "'>" + response[i].Name + "</option>";
                obj_ddl_ExistingIdea.append(str_newOption);
            }
            obj_ddl_ExistingIdea.multiselect("reload"); //using reload its working for me

Answer 3

这是100％的优秀代码......

$(document).ready(function() {
var chkreport = $('#reporting_unit'); // Object creation for your dropdown

var ajaxpath = 'ajax/fend.php';
var ajaxUrl = baseUrl + ajaxpath;
$('#hospital_category').on('change', function() {
var hospital_id = this.value;
//alert(hospital_id);
$.ajax({
method: 'POST',
url: ajaxUrl,
data: {
perform_action: 'reporting_list',
hospital_id: hospital_id
},
dataType: 'html',
success: function(result) {

chkreport.append(result); // append option in the object created before ajax calling

// Now call multiselect function with their parameter
chkreport.multiselect({
columns: 1,
placeholder: 'Select Reporting Unit',
search: true,
selectAll: true
});

chkreport.multiselect('rebuild'); // it will reload dropdown need to create multiselect with checkbox option.
}
});

});

});

Bootstrap多选刷新或重建不起作用

3 个答案: