галочка не отображается при программном выборе строки в slickGrid - PullRequest
Новая
       101

галочка не отображается при программном выборе строки в slickGrid

0 голосов
/ 19 марта 2020

Я изменил файл example-checkbox-row-select. html в примерах для программного выбора строки. Я добавил кнопку со следующим кодом: 

<button id="clickCheckRow" style="position:relative;height:30px">Click Check Rows</button>

и 

$("#clickCheckRow").click(function() {
        let rowIndex = 5;
        selectedRowsIndexes = grid.getSelectedRows();
        selectedRowsIndexes.push(rowIndex); // add row with index 5 to selected rows indexes
        grid.updateRow(rowIndex); // update the row with index 5
        grid.invalidateRow(rowIndex); // tells that row with index 5 has changed
//            grid.invalidateRows();  // this does not work either
        grid.render(); // the invalidated rows should change, but the check mark does not show up
});

Когда я нажимаю кнопку, строка выделяется, но флажок не устанавливается.

Обновление:

Мне все еще нужен дубликат pu sh для selectedRowsIndexes 

$("#clickCheckRow").click(function() {
      let rowIndex = 5;
      let selectedRowsIndexes = grid.getSelectedRows(); // using let, as suggested
      selectedRowsIndexes.push(rowIndex); // add row index to selected rows
      selectedRowsIndexes.push(rowIndex); // will not work without this duplication
      grid.setSelectedRows(selectedRowsIndexes);
});

1 Ответ

0 голосов
/ 26 марта 2020

Я также разместил этот ответ на https://github.com/6pac/SlickGrid/issues/478 Однако я не знаю, могут ли мои предлагаемые изменения иметь непредвиденные последствия.

При программном выборе строки (например, при нажатии к кнопке) соответствующий флажок не устанавливается. Я изменил программу "example-checkbox-row-select. html" из папки примеров для моего тестирования. Смотрите ниже: 

<body>
    <button id="selectRow5" style="position:relative;height:30px">
      select row 5</button>

    <button id="unselectRow5" style="position:relative;height:30px">
      unselect row 5</button>

    <button id="unselectAllRows" style="position:relative;height:30px">
      unselect all rows</button>

. , , et c. 

<script>
var grid;

$("#selectRow5").click(function() {
    let rowIndex = 5; // use row 5 for this example
    let selectedRowsIndexes = grid.getSelectedRows();
    selectedRowsIndexes.push(rowIndex);
    grid.setSelectedRows(selectedRowsIndexes);
});

$("#unselectRow5").click(function() {
    let rowIndex = 5; // use row 5 for this example
    let newSelectedRowsIndexes = [];
    let oldSelectedRowsIndexes = grid.getSelectedRows();
    while (oldSelectedRowsIndexes.length != 0) {
        let indexFound = oldSelectedRowsIndexes.pop();
        if (indexFound != rowIndex) {
            newSelectedRowsIndexes.push(indexFound)
        }
    }
    grid.setSelectedRows(newSelectedRowsIndexes);
});

$("#unselectAllRows").click(function() {
    grid.setSelectedRows([]);
});
</script>

1 - Запустите программу, нажмите первую кнопку (выберите строку 5). Строка 5 выбрана, но флажок не установлен. В поле отображается флажок, если вручную выбрать любую другую строку, установив соответствующий флажок.

2 - Запустите программу, дважды нажмите первую кнопку. Флажок проверяется при втором нажатии. Нажмите вторую кнопку (отмените выбор строки 5). Строка не выбрана, но флажок не снят. Нажмите на любую другую строку. Галочка теперь снята.

3 - Запустите программу. Нажмите первую кнопку дважды. Галочка отмечена. Нажмите на вторую кнопку (отмените выбор строки 5). Галочка не проверена. Нажмите на третью кнопку (отмените выбор всех строк). Галочка не снята. Нажмите на флажок любой другой строки. Галочка в строке 5 не отмечена.

РЕШЕНИЕ: Изменить функцию handleSelectedRangesChanged (e, диапазоны) (вокруг строки 2683 slick.grid. js) строки комментариев 2703 и 2705. См. Ниже: 

//  if (simpleArrayEquals(previousSelectedRows, selectedRows)) {
        trigger(self.onSelectedRowsChanged, {rows: getSelectedRows()}, e);
//  }
...