Select2爲MVC中的多選擇設置值

Question

我正在使用部分表單上的select2多選項目。此代碼適用於創建頁面，但當我進入編輯頁面時，我遇到了一個問題。我希望能夠從創建「Items」的過程中獲取我的值，然後使用jQuery在Edit頁面上設置這些「Items」的值。

這是我有：

var re = /[0-9]+$/; 
$('#Item').select2({ 
    theme: "bootstrap", 
    placeholder: "Not Set", 
    tags: true 
}); 

$('#Item').on("select2:select", function (evt) { 
    var element = evt.params.data.element; 
    var $element = $(element); 
    $element.detach(); 
    $(this).append($element); 
    $(this).trigger("change"); 
}); 

var values = "@Model.ItemIds"; //pull ItemIds from Model in MVC 
$.each(values.split(","), function (i, e) { 
    if (e != "Not Set" && e != "" && e != null && e != undefined) { 
     if (!re.test(e)) { 
      var newList = $.merge($('#Item').select2('data'), [{ 
       id: e, 
       tag: e 
      }]); 
      $("#Item").select2('data', newList); 
      $("#Item").append('<option value="' + e + '">' + e + '</option>'); 
     } 
    $("#Item option[value=" + e + "]").prop("selected", true); 
    } 
}); 

那麼，什麼情況是，在加載頁面時，我得到的是選擇的項目是在@Model.ItemIds的那些，但它們在它們下面列出的順序<select>不是他們的訂單@Model.ItemIds.任何幫助，將不勝感激。謝謝！

Answer 1

這是我的新代碼：

var values = "@Model.ItemIds"; //pull ItemIds from Model in MVC 
$.each(values.split(","), function (i, e) { 
    if (e != "Not Set" && e != "" && e != null && e != undefined) { 
     if (!re.test(e)) { 
      var newList = $.merge($('#Item').select2('data'), [{ 
       id: e, 
       tag: e 
      }]); 
      $("#Item").select2('data', newList); 
      $("#Item").append('<option value="' + e + '">' + e + '</option>'); 
     } 
     else{ 
      $("#Item").append($("#Item option[value='" + e + "']")); 
     } 
    $("#Item option[value='" + e + "']").prop("selected", true); 
    } 
}); 

追加現有的選項，最終似乎已經解決了我的問題。