2017-09-05 66 views
0

我有两个下拉列表,其中一个是依赖另一个。我们称之为multiselect 1和multiselect 2.根据multiselect1中选定的值,multiselect 2的下拉列表通过ajax调用进行更改。当使用bootstrap-multiselect并选择'全选'时,它不会触发AJAX调用

我正在触发基于'onChange'的ajax调用。 但是,当用户打开页面,默认情况下所有值将在多选1中被选中,但因为我目前的设置仅适用于onchange,所以如何根据所有选中的默认值触发我的ajax调用? 在变化AJAX调用它完美的作品在所有选择---除了>

$('#market-select').multiselect(

       { 

       includeSelectAllOption: true, 
       selectAllValue: 'multiselect-all', 
       filterBehavior: 'value', 
       enableFiltering: true, 
       buttonWidth: '270px', 
       onChange: function (option, checked) { 
        var markets = $('#market-select option:selected'); 
        var selected = []; 
        var json = "'" + JSON.stringify(selected) + "'"; 
        $(markets).each(function (index, markets) { 
         selected.push($(this).val()) 
        }); 
        $.ajax({ 
         type: "POST", 
         dataType: "json", 
         url: _config.GetCampaignsByMarket, 
         data: JSON.stringify({ 
          marketValue: selected 
         }), 
         contentType: 'application/json', 
         success: function (data) { 
          var items = ''; //the original example which makes constant call to dom when the other one makes call only twice 
          $('.select-ajax').empty(); 
         $.each(data, function (key, val) { 
           $('.select-ajax').append('<option selected value="' + val.CampaignInitiative + '">' + val.CampaignInitiative + '</option>'); 
          items += "<option value='" + val.CampaignInitiative + "'>" + val.CampaignInitiative + "</option>"; 

          }); 






          $('.select-ajax').multiselect('rebuild'); 



         }, 
         error: function (xhr, status, error) { 

         } 
        }); 



       } 


      }); 

Attemt来初始化初始化这显然行不通Ajax调用。我现在疯了。

$("#market-select").multiselect('selectAll', false); 
      $("#market-select").multiselect('updateButtonText'); 

      var allMarkets = $('#market-select:selected').map(function (a, item) { 

       $.ajax({ 
        type: "POST", 
        dataType: "json", 
        url: _config.GetCampaignsByMarket, 
        data: JSON.stringify({ 
         marketValue: allMarkets 
        }), 
        contentType: 'application/json', 
        success: function (data) { 
         var items = ''; //the original example which makes constant call to dom when the other one makes call only twice 
         $('.select-ajax').empty(); 
         $.each(data, function (key, val) { 
          $('.select-ajax').append('<option selected value="' + val.CampaignInitiative + '">' + val.CampaignInitiative + '</option>'); 
          items += "<option value='" + val.CampaignInitiative + "'>" + val.CampaignInitiative + "</option>"; 

         }); 
         //var options = data.map(function (o) { 
         // return '<option selected value="' + o.CampaignInitiative + '">' + o.CampaignInitiative + '</option>'; // faster as it only accesses the DOM twice, compared to the original's 2+N array items.' 
         //}).join(''); 






         $('.select-ajax').multiselect('rebuild'); 



        }, 
        error: function (xhr, status, error) { 

        } 
       }); 

      }); 

回答

1

Right here bootstrap-multiselect有onSelectAll配置。那是你在找什么?

+0

yup!现在工作。谢谢! –

+0

所以现在它通过添加配置工作selectAll,deselectAll。但是,当尝试使用allSelected进行初始化时,它仍然不会触发ajax调用,但只有在单击它时才会触发。任何见解? –

+1

没关系!这一切工作!谢谢! –

相关问题