mazdik / ng-mazdik

Angular UI component library
https://mazdik.github.io/ng-mazdik
MIT License
89 stars 34 forks source link

indeterminate selection option for Tree table template #60

Open Anzil-Aufait opened 4 years ago

Anzil-Aufait commented 4 years ago

Is there any indeterminate selection option for Tree table grouping. Only select all or unselect all option.

mazdik commented 4 years ago
<ng-template #rowCheckboxTemplate let-row="row">
  <span class="{{'dt-' + table.settings.selectionMode}}">
        <input [type]="table.settings.selectionMode"
              [checked]="table.selection.isSelected(this.row.$$index)"
              [indeterminate]="partiallySelectedRow(row)"
              (click)="onCheckboxClick(row)"/>
  </span>
</ng-template>

  getDescendants(row: Row) {
    const results = [];
    for (let i = row.$$index + 1; i < this.rows.length && row.$$level < this.rows[i].$$level; i++) {
      results.push(this.rows[i]);
    }
    return results;
  }

  partiallySelectedRow(row) {
    let descendant = this.getDescendants(row);
    // find any selected row
    // this.selection.isSelected(descRow.$$index)
  }
Anzil-Aufait commented 4 years ago

@mazdik , onCheckboxClick(row) there is no function with this name.

I'm adding an extra checkbox for dtHeaderTemplate template to select it's child rows. Because there is no option for row multiselect in your work.

This is my stackblitz demo

mazdik commented 4 years ago
  onCheckboxClick(row: Row) {
    this.table.selection.toggle(row.$$index);
    this.table.events.onCheckbox(row);
  }
Anzil-Aufait commented 4 years ago
  onCheckboxClick(row: Row) {
    this.table.selection.toggle(row.$$index);
    this.table.events.onCheckbox(row);
  }

It's not working as expected. It only selecting the first sibling, you can check here