「全選」在Kendo MultiSelect（mvc）

Question

我有一個自定義編輯器的kendo網格，其中一個是多選（這個是http://demos.telerik.com/aspnet-mvc/multiselect）。我有一個看起來像這樣的編輯器CSHTML文件：

@model IEnumerable<ManageSitesInTemplateViewModel> 
@(Html.Kendo().MultiSelectFor(m => m) 
    .AutoClose(false) 
    .DataTextField("SiteName") 
    .DataValueField("SiteId") 
    .BindTo((IEnumerable<ManageSitesInTemplateViewModel>)ViewData["sites"]) 
) 

，使用「bindto」，這是從得到的ViewData數據請求頁面時創建。一切正常，就好像沒問題。 問題是我一直在試圖實現一個「選擇/取消全選」按鈕使用各種實現無濟於事。我懷疑這是因爲我使用「bindto」。 這是一些我已經試過例子：

How can we implement select All option in Kendo MultiselectFor

http://docs.telerik.com/kendo-ui/controls/editors/multiselect/how-to/selection/select-deselect-all-items

http://www.telerik.com/forums/select-all-items-after-data-is-read

我可以得到按鈕正確選擇一切，但被選中的一切，當我嘗試保存在網格上的條目，該行爲不被解僱。沒有任何反應，選擇重置。如果我手動選擇，仍然有效。

這是怎麼回事？自定義編輯 全碼：

@model IEnumerable<ManageSitesInTemplateViewModel> 
@(Html.Kendo().MultiSelectFor(m => m) 
    .AutoClose(false) 
    .DataTextField("SiteName") 
    .DataValueField("SiteId") 
    .BindTo((IEnumerable<ManageSitesInTemplateViewModel>)ViewData["sites"]) 
) 
<button class="k-button" id="selectall123">Select All</button> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#selectall123").on('click', function (e) { 
      e.preventDefault(); 
      var multiselect = $('#Sites').data("kendoMultiSelect"); 

      var all = $.map(multiselect.dataSource.data(), function (dataItem) { 
       return dataItem.SiteId; 
      }); 
      multiselect.value(all); 
     }); 
    }); 
</script> 

Answer 1

我會後的解決方案，我最終得到，如果任何人發現他們的方式對這一問題。 從Telerik自己的論壇獲得幫助後，他們向我提供了可用的解決方案。 我只是要報價直接從他們：

當使用多選的value（）方法，綁定到插件的模式將無法更新，因爲這種方法不會觸發更改事件。您可以通過選擇項目後，手動觸發變化繞過此：

的答案代碼：

<script type="text/javascript"> 
$(document).ready(function() { 
$("#selectall123").on('click', function (e) { 
... 

multiselect.value(all); 
multiselect.trigger("change"); 
}); 
}); 
</script> 

Answer 2

我得到了同樣的傢伙，這是爲我工作的例子。

@(Html.Kendo().MultiSelect().Name("Config_MetricType") 
          .BindTo(Model.Config_MetricTypes) 
          .DataValueField("MetricTypeId") 
          .DataTextField("MetricDisplayName") 
          .Events(e => e.DataBound("selectAllMetrics")) 
          .HtmlAttributes(new { style = "width: 50%", @class = "pull-left" })) 

JavaScript函數：

function selectAllMetrics() { 
    var Config_MetricType = $("#Config_MetricType").data("kendoMultiSelect"); 
    var all = $.map(Config_MetricType.dataSource.data(), function (dataItem) { 
     return dataItem.MetricTypeId; //DataValueField 
    }); 
    Config_MetricType.value(all); 
    Config_MetricType.trigger("change"); 
}