Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug: multiselect loading from server deselects all #339

Open
macjohnny opened this issue Oct 7, 2021 · 8 comments
Open

Bug: multiselect loading from server deselects all #339

macjohnny opened this issue Oct 7, 2021 · 8 comments

Comments

@macjohnny
Copy link
Member

Another issue when using multi-select, when you deselect the last one from filtered results, it will deselect all, included previous selected values stackblitz
yeqIVVnXAd-output

adding the invisible option solves it, but causes a different issue with ctrl+a. instead of deselecting all (after selecting all) it selects all again.

Originally posted by @MoishyS in #311 (comment)

@macjohnny
Copy link
Member Author

macjohnny commented Oct 7, 2021

we can solve the issue partially, by only showing options that are not in the filtered results stackblitz

this.hiddenOptions = this.filteredServerSideBanks.pipe(
      map(
        (values) =>
          this.bankServerSideCtrl.value?.filter(
            (a) => !values.find((b) => a.id == b.id)
          ) ?? []
      )
    );

it's still an issue when you deselect all, it will also deselect the options that aren't included in the filtered results.

Originally posted by @MoishyS in #311 (comment)

@macjohnny
Copy link
Member Author

ok, was able to solve it, by only showing the options if search ctrl is empty stackblitz

<ng-container *ngIf="!bankServerSideFilteringCtrl.value">
   <mat-option *ngFor="let bank of bankServerSideCtrl.value"
       [value]="bank" style="display: none">
     {{ bank.name }}
  </mat-option>
</ng-container>

also need to remove filter((search) => !!search) as we won't hide the options when the select is visible, and will then have the issues with ctrl+a.

my question is, if this is the right way to fix, or do we have a better solution?

Originally posted by @MoishyS in #311 (comment)

@MoishyS
Copy link

MoishyS commented Oct 7, 2021

we can base it on mat-select openedChange instead of bankServerSideFilteringCtrl.value, so we can leave the filter((search) => !!search)

@macjohnny
Copy link
Member Author

@MoishyS so do you have a suggestion how to improve the example?

@MoishyS
Copy link

MoishyS commented Oct 18, 2021

  • we should add an example for multi-select
  • currently each bank will have the same object reference, on a real server-side filtering it will be a new object, and will have to add a compareWith
  • we should to the example how to add a default value
  • we should add the current selected options when select is not open - to fix this bug

@macjohnny
Copy link
Member Author

macjohnny commented Oct 19, 2021

@MoishyS thanks for your suggestions. do you want to implement the changes you suggested?

@imohammadali
Copy link

Hi @macjohnny I can build a server side searching component if other guy not working on it

@MoishyS
Copy link

MoishyS commented May 31, 2023

@mohammadaliez sure

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants