Select All selection bug in wijmo grid

Posted by: technical.store.technical on 11 June 2021, 1:32 am EST

  • Posted 11 June 2021, 1:32 am EST

    Hi,

    I have a scenario in which i want to make 'ALL' selected in a dropdown cell.
    Example -
    in my first row, for Subsubjects column i have only one value in the collection which is checked but it doesn't show 'ALL' value in UI.

    https://stackblitz.com/edit/angular-e3228b?file=src/app/app.component.ts

    For this i've added the below code -

    if (col.binding === 'subjects') {

    checkedItemsChanged: s => {
    s.headerFormat =
    s.checkedItems.length !== s.collectionView.sourceCollection.length
    ? s.checkedItems.toString()
    : 'ALL';
    item.subjects = s.checkedItems;
    const subjectColIndex = grid.columns.getColumn('Subsubjects').index;
    const rng = new wjcGrid.CellRange(rowIndex, subjectColIndex);
    // console.log('The get length', this.getSubSubjects(item).length);
    if (
    item.subjects.length > 1 ||
    this.getSubSubjects(item).length === 1
    ) {
    item.Subsubjects = this.getSubSubjects(item);
    } else {
    item.Subsubjects = [];
    }

    grid.refreshRange(rng);
    }
    // selectedIndexChanged: s => {
    // grid.collectionView.refresh();
    // }
    });

    e.cell.innerHTML = '';
    e.cell.appendChild(host);
    } else if (col.binding === 'Subsubjects') {

    let multiSel = new wjcInput.MultiSelect(host, {

    checkedItems:
    item.subjects.length > 1
    ? this.getSubSubjects(item)
    : item.Subsubjects,
    headerFormat:
    item.Subsubjects.length < this.getSubSubjects(item).length
    ? item.subjects.length > 1
    ? 'ALL'
    : item.Subsubjects.join(', ')
    : 'ALL',

    checkedItemsChanged: s => {
    s.headerFormat =
    s.checkedItems.length !== s.collectionView.sourceCollection.length
    ? s.checkedItems.toString()
    : 'ALL';
    item.Subsubjects = s.checkedItems;
    }
    });

    e.cell.innerHTML = '';
    e.cell.appendChild(host);
    }


    Please provide solution.

    Thank you.
  • Replied 13 June 2021, 2:57 pm EST

    Hi,

    Can you please help us with the solution.

    Thank you.
  • Replied 13 June 2021, 11:44 pm EST

    Hi,

    This is not a bug, and you are observing this because of the maxHeaderItems property of multiselect. The default value for this property is 2. And to fulfill required functionality you may set maxHeaderItems property as follows -
    multiselect.maxHeaderItems = 0;

    You may refer to the sample link below for reference:

    https://stackblitz.com/edit/angular-tdqfte?file=src/app/app.component.ts

    Regards,
    Ashwin
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels