I have a kendo grid with some custom editors, one is a multiselect. I have a cshtml file for the editor that looks like so:
@model IEnumerable<
ManageSitesInTemplateViewModel
>
@(Html.Kendo().MultiSelectFor(m => m)
.AutoClose(false)
.DataTextField("SiteName")
.DataValueField("SiteId")
.BindTo((IEnumerable<
ManageSitesInTemplateViewModel
>)ViewData["sites"])
)
It uses the "bindto" which is data gotten from ViewData that is
created when the page is requested. Everything works fine just as it
should, no problems there.
The problem is I have been trying to implement a "select/deselect all"
button using various implementations to no avail. I have a suspicion
that it's because I use "bindto".
This is some of the examples I have tried:
https://stackoverflow.com/questions/28207667/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
I can get the button to select everything correctly, but when
everything is selected and I try to save the entry on the grid, the
action is not fired. Nothing happens and the selection resets. Still
works if I select manually.
What is going on?
Full code for the custom editor:
@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
>