剑道 MVC 网格集以编程方式选择模式

Question

我有一个剑道MVC网格，我想在选中复选框后使用Javascript或JQuery将选择模式从单个更改为多个，并在取消选中复选框时从多个更改为单个。这可能吗？(我也在绑定和取消绑定更改事件，这按预期工作(。这是我目前尝试更改选择模式的方法，但它不起作用：

<div class="col-md-5 col-sm-5" style="background-color: #52666f;">
<h2 style="color:#fff;font-size:18px;margin-top:10px;margin-left:13px;">MultiSelect Products</h2>
@(Html.Kendo().CheckBox()
.HtmlAttributes(new { style = "" })
.Name("MultiSelect")
)
</div>

<div class="col-md-12 col-sm-12">
<h2 style="color:#fff;font-size:18px;margin-top:10px;margin:auto;width:100%;text-align:center;">Select Product</h2>
@(Html.Kendo().Grid<ManufacturerProduct>()
.Name("grdMainManufacturerProducts")
.AutoBind(false)
.Columns(columns =>
{
columns.Bound(manpr => manpr.Name).Width(150);
columns.Bound(manpr => manpr.GenericStyle).Width(150);
})
.HtmlAttributes(new { style = "height: 420px;" })
.Selectable(selectable => selectable
.Mode(GridSelectionMode.Single)
.Type(GridSelectionType.Row))
.Scrollable()
.Sortable()
.Filterable(filterable => filterable
.Extra(false)
.Operators(operators => operators
.ForString(str => str.Clear()
.Contains("Contains")
))
)
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
.Events(events => events.Change("onChangeMainManProduct"))
.Filterable(filterable => filterable
.Enabled(true))
.DataSource(dataSource => dataSource
.Ajax()
.Model(model =>
{
model.Id(manpr => manpr.Id); 
})
.Read(read => read
.Url(Url.Content("~/json/ManufacturerProductsController/ManufacturerProduct_ReadMainProduct"))
.Data("additionalDataForReadManProducts"))
)
)
</div>
<script>    
$(function () {
$('#MultiSelect').change(function () {
var checked = $(this).is(':checked');
onChangeMultiSelect(checked);
});
});
function onChangeMultiSelect(checked) {
var grid = $("#grdMainManufacturerProducts").data("kendoGrid");
if (checked == true) {
//alert("Checked!");
grid.selectable = 'Multiple';
grid.select.setMode('Multiple');
('#grdMainManufacturerProducts).data("kendoGrid").unbind('change');
}
else {
//alert("UnChecked!");
grid.bind("change", kendoGridWithCheckboxSelectionOnChange);
grid.selectable = 'Single';
grid.select.setMode('Single');

}
}
function kendoGridWithCheckboxSelectionOnChange() {
alert("Change reactivated");
}
</script>

我还制作了一个剑道UI道场来尝试达到预期的效果，你可以在这里找到它： 剑道UI设置网格选择模式

谁能对此有所了解？提前感谢！

Answer 1

您可以使用setOptions方法完成此操作，如下所示：

if (checked == true) {
//alert("Checked!");
grid.setOptions({
selectable: "multiple"
});
('#grid').data("kendoGrid").unbind('change');
} else {
//alert("UnChecked!");
grid.bind("change", kendoGridWithCheckboxSelectionOnChange);
grid.setOptions({
selectable: "single"
});
}