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"])
)

它使用＆＃34; bindto＆＃34;这是从请求页面时创建的ViewData获取的数据。一切正常，但没有任何问题。问题是我一直试图实施一个＆＃34;选择/取消选择所有＆＃34;按钮使用各种实现无济于事。我怀疑它是因为我使用＆＃34; bindto＆＃34;。这是我尝试过的一些例子：

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自己的论坛的帮助后，他们为我提供了这个有效的解决方案。我只是直接引用他们的话：

使用MultiSelect的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");
}

＆＃34;全选＆＃34;在剑道MultiSelect（mvc）

2 个答案: