Установите / снимите все элементы в столбце флажков Telerik / Kendo Grid

Question

У меня есть Telerik Grid с тремя столбцами. Я только публикую здесь объявление столбцов, чтобы сосредоточиться только на нем:

        .Columns(columns =>
        {
            columns.Bound(s => s.field1).Filterable(false);
            columns.Bound(s => s.field2).Filterable(false);                
            columns.Bound(s => s.BoolField).HeaderTemplate("<label><input id='selectall' class='chkbx' type='checkbox' onclick='ToggleChkBox(this.checked);'>All selected</label>")
                                        .ClientTemplate("<input type='checkbox' class='chkbxq' name='chkEnabled' <#= BoolField ? checked='checked' : '' #> 'text-align:center' onclick='onClickCheckBoxColumn()'/>")
                   .ReadOnly(false)
                   .Title("Activa")
                   .Width(40)
                   .HtmlAttributes(new { style = "text-align:center" })
                   .HeaderHtmlAttributes( new { style = "text-align:center" });                
        })

Javascript function :

function ToggleChkBox(flag) {
    $('.chkbxq').each(function () {            
        $(this).prop('checked', flag);
    });
}

Эта сетка имеет столбец флажка. Также я установил флажок в заголовке столбца. Когда этот флажок в заголовке столбца установлен, я хочу установить все флажки в столбце, а когда он снят, я хочу снять все флажки столбца. Вышеупомянутая функция ToggleChkBox работает, но только для элементов на текущей странице сетки, например, если сетка отображает элементы на первой странице, все элементы на первой странице отмечены / не отмечены, а остальные элементы на других страницах - нет. проверяется / не проверяется. Так как же я могу отметить / снять все пункты на всех страницах сетки из функции javascript?

Answer 1

Вместо использования шаблона клиента, вы можете использовать встроенный флажок выбора, и вы можете включить его, добавив следующие строки как

 columns.Select().Width(50); //which will show checkbox with select all option
 columns.Bound(s => s.field1).Filterable(false);
 columns.Bound(s => s.field2).Filterable(false);  

, для этого вы должны включить параметр выбора как multiple как следует

.Selectable(selectable =>
{
     selectable.Mode(Kendo.Mvc.UI.GridSelectionMode.Multiple);
     selectable.Type(Kendo.Mvc.UI.GridSelectionType.Row);
})

Answer 2

Похоже, вы пытаетесь сделать что-то, для чего в Kendo уже есть встроенная поддержка. Вы пытались использовать column.Select ()?

Вот демоверсия Кендо для флажков в сетке:

https://demos.telerik.com/aspnet-mvc/grid/checkbox-selection