使用多選列表框時未顯示的附加項目

-1

附加項目在不包括第二個腳本（這是使列表框帶有複選框的圓滑外觀列表框）時非常合適 - 但是當我包含它時，不附加項目。使用多選列表框時未顯示的附加項目

有什麼理由？

JQuery的：

$("#ddlistcategory").change(function() { 
     var catItem = $("#ddlistcategory").val(); 

     $("#ddlistaccountitems").empty(); 
     $.ajax({ 
       url: '@Url.Action("GetCategories", "Account")', 
       dataType: "json", 
       type: "Post", 
       data: { "i": catItem }, 
       success: function (data) { 

        $.each(data, function (key, val) { 
         //alert(key + " " + val); 
         $("#ddlistaccountitems").append('<option id="' + key + '">' + val + '</option>'); 
        }) 
       } 
      }); 
     }); 

$('#ddlistaccountitems').multiselect({ 
    includeSelectAllOption: false, 
    allSelectedText: 'No option left ...', 
    enableFiltering: true, 
    filterPlaceholder: 'Search for something...' 
});

查看：

<div class="form-group form-group-sm"> 
    @Html.Label("Items", new { @class = "control-label" }) 
    @Html.ListBoxFor(x => x.SelectedAccountItems, Model.UserItems, new { @class = "form-control", @id = "ddlistaccountitems", @multiple = "multiple" }) 
</div>

來源

2017-05-24 AxleWack

你是你的AJAX方法，是用填充選項的元素之外調用多選。因此，你將在ajax完成之前初始化它，所以這個問題很可能是初始化還沒有從中建立的選項。

要解決此問題，請將初始化移入成功方法，以便在ajax完成並且創建所需的所有數據後執行。

來源

2017-05-24 15:15:03 Taplar

哇！很簡單！這個竅門100％！謝謝Taplar！ – AxleWack

-1

您的Ajax調用將異步工作。也就是說，.multiselect將在附加選項之前執行。 .multiselect將隱藏您的實際select並將其替換爲自定義html。所以你必須在執行.multiselect之前填寫它。添加

async: false

在Ajax調用或致電

$('#ddlistaccountitems').multiselect()

，成功函數內。

來源

2017-05-24 15:15:35 rinesh

你應該避免異步：false。這是與範例相反，也已被刪除jQuery 3.X – Taplar

是的..它不是一個最佳的解決方案。更好地移動多選到成功功能。 – rinesh

使用多選列表框時未顯示的附加項目

回答

相關問題