select2沒有更新後禁用選定的選項

Question

我試圖禁用select2中選定的選項，但它似乎像select2不刷新。

我的目的是在選擇它後禁用select2列表中的每個項目。我看到HTML表示該選項具有禁用屬性，但該選項在select2元素中仍處於啓用狀態。

$("#select-filter").select2({ 
    placeholder: "Select a category", 
    data:[{ 
     id: "", 
     text: "" 
    },{ 
     id: "project", 
     text: "project" 
    },{ 
     id: "date", 
     text: "date" 
    },{ 
     id: "user", 
     text: "user" 
    }] 
}).on("change", function(e) { 
    $("#select-filter :selected").attr("disabled", "true"); 
}); 

見例如：https://jsfiddle.net/bkqeqbay/1/

Answer 1

可以使用select事件，並像這樣的數據：

...}).on("select2:select", function(e) { 
    console.dir(e.params.data); 
    e.params.data.disabled = true; 
}); 

更新小提琴：https://jsfiddle.net/bkqeqbay/4/

請注意，如果您還必須禁用您可以執行的基本選擇元素選項：

var index = $(e.params.data.element).index(); 
$("#select-filter").find('option').eq(index).prop('disabled',true);