Флажок SlickGrid Select Column Plugin «Check All»

Question

Я знаю, что могу прокручивать строки и получать все идентификаторы и задавать строки для выбора через массив.

var rows = []; 
     for (var i = 0; i < _grid.getDataLength(); i++) { 
     rows.push(i); 
     } 
     _grid.setSelectedRows(rows); 

Но как я огонь событие программно проверить/снимите флажок заголовка, который выбирает/отменяет выделение всех строк?

Это фрагмент кода в JS файл плагина, который ищет поле заголовка для проверки:

function handleHeaderClick(e, args) { 
     if (args.column.id == _options.columnId && $(e.target).is(":checkbox")) { 
      // if editing, try to commit 
      if (_grid.getEditorLock().isActive() && !_grid.getEditorLock().commitCurrentEdit()) { 
       e.preventDefault(); 
       e.stopImmediatePropagation(); 
       return; 
      } 

      if ($(e.target).is(":checked")) { 
       var rows = []; 
       for (var i = 0; i < _grid.getDataLength(); i++) { 
        rows.push(i); 
       } 
       _grid.setSelectedRows(rows); 
      } 
      else { 
       _grid.setSelectedRows([]); 
      } 
      e.stopPropagation(); 
      e.stopImmediatePropagation(); 
     } 
    } 

Answer 1

Установка выбранных строк, как вы описываете с помощью grid.setSelectedRows() обновит «Выбрать/Отменить все» флажок в строка заголовка. Плагин «Checkbox Select Column» подписывается на сетки onSelectedRowsChanged, которое инициируется grid.setSelectedRows(). Когда это событие происходит, плагин вызывает функцию handleSelectedRowsChanged(e, args), которая определяет, нужно ли отмечать флажок «Выбрать/Отменить все» и соответственно обновить его.

Установка выделенных элементов в пустой массив с использованием следующего фрагмента очищает все флажки.

//Select no rows - clear the header checkbox 
grid.setSelectedRows([]); 

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

//Select all rows - will check header checkbox 
//Generate an array of all rows ids from the grid data 
var rows = []; 
for (var i = 0; i < grid.getDataLength(); i++) { 
    rows.push(i); 
} 
//Set selected rows on grid 
grid.setSelectedRows(rows); 

Если вы действительно должны вызвать событие, чтобы проверить/снимите флажок «Выбрать/Отменить все» заголовка флажок, то вы могли бы использовать что-то вроде ниже. Однако я настоятельно рекомендую придерживаться вышеуказанных методов.

//Determine if the checkbox is currently checked 
var currentlyChecked = $('#myGrid').find('.slick-header-column:first-child').find('input').prop('checked') 

//Set to reverse of current i.e. !currentlyChecked 
$('#myGrid').find('.slick-header-column:first-child').find('input').prop('checked', !currentlyChecked).trigger('click'); 

Следующая скрипка демонстрирует это с помощью кнопок для каждого из методов выбора элементов.

http://jsfiddle.net/z83fjth4/