2014-12-06 62 views
1

我使用的劍道UI多選: http://demos.kendoui.com/web/multiselect/events.htmlKendoUI多選刪除多個

我有這樣的數據:

var data = 
    [ 
     { text: "Shirt-Black", value: "1" }, 
     { text: "Shirt-Brown", value: "2" }, 
     { text: "Shirt-Blue", value: "3" }, 
     { text: "Cap-Green", value: "4" }, 
     { text: "Cap-Red", value: "5" }, 
     { text: "Cap-White", value: "6" }, 
     { text: "Jacket-Denim", value: "7" } 
    ]; 

現在我想,如果我選擇「T恤 - 布朗」然後休息恤即條目「襯衫黑色」和「襯衫藍色」不應該出現在列表中,這意味着用戶不應該能夠選擇兩種顏色的襯衫。

同樣,如果選擇了任何顏色的「上限」,則用戶不應選擇任何其他顏色的「上限」。

有什麼辦法可以達到這個目的嗎?

回答

0

這不是內置功能。你甚至不能使用dataSource filter()方法,因爲它也會從列表中刪除選定的項目。

然而,這段代碼會做什麼你問:

$("#select").kendoMultiSelect({ 
    ... 
    change: function(e) { 
     var dataItems = e.sender.dataItems(); 
     var categories = []; 

     for(var i = 0; i < dataItems.length; i++){ 
     var category = dataItems[i].text.substring(0, dataItems[i].text.indexOf('-')); 
     categories.push(category); 
     } 

     e.sender.ul.find('li').each(function(index, value){ 
     var $li = $(value); 
     var hidden = false; 
     for(var i = 0; i < categories.length; i++){ 
      var category = categories[i]; 
      if ($li.text().match("^" + category)){ 
      $li.css('display', 'none'); 
      hidden = true; 
      } 
     } 
     if(!hidden){ 
      $li.css('display', 'list-item'); 
     } 
     }); 
    } 
}); 

工作KendoUi道場:http://dojo.telerik.com/AGisi