ghiscoding / Aurelia-Bootstrap-Plugins

Aurelia-Bootstrap-Plugins are Custom Elements to bridge with a set of 3rd party Bootstrap addons
https://ghiscoding.github.io/Aurelia-Bootstrap-Plugins
MIT License
45 stars 23 forks source link

Deselection with single-select abp-select #60

Closed Mobe91 closed 5 years ago

Mobe91 commented 5 years ago

Provide an option to add a deselect option to the options list of an abp-select. When the user selects this option, the backing value binding should be set to null or to some user-provided value.

@ghiscoding I'm not sure if this should be handled by the component or if it is better to leave this to the user. What do you think?

ghiscoding commented 5 years ago

@Mobe91 All the Bootstrap-Select methods are exposed, just use the deselectAll and that's it. There's already info on how to do that in the README

Mobe91 commented 5 years ago

Ok but even when using deselectAll, the user still has to manually add some trigger element in the UI that invokes the method...

ghiscoding commented 5 years ago

not sure to understand, can you provide some examples of what you mean in code

Mobe91 commented 5 years ago

What I meant is: When the end user decides that he wants to deselect the current selection, he needs some UI element (the trigger element I was referring to) to click on. This element can then call deselectAll as you said. But currently, a developer would have to add such a UI element manually and it would be external to abp-select.

Moreover, I just discovered that deselectAll will only work if multiple selection is enabled as you can see here.

Mobe91 commented 5 years ago

Hm so I think the issue is rather with the wrapped bootstrap-select that is used by abp-select. See https://github.com/silviomoreto/bootstrap-select/issues/1449 for similar requirement as mine that is not yet supported by bootstrap-select.

The suggested workaround uses the data-max-options attribute which is currently not supported by abp-select for the select element but only for optgroup. Would be nice to make this available also on the select element so the workaround can be used.

ghiscoding commented 5 years ago

It's possible since I had to write/expose them all 1 by 1, so I could have missed some and/or if something is not well documented then it won't show up in abp-select. You can see them exposed here with their arguments when there are

Mobe91 commented 5 years ago

I will test if the workaround with data-max-options works and create a PR.

Mobe91 commented 5 years ago

The workaround with data-max-options works but no PR is required since it is possible to pass this option via the picker-options attribute like this:

<abp-select picker-options.bind="{maxOptions: 1}" multiple></abp-select>