Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

<select multiple ng-options> do not support default/empty option #4325

Closed
martin-g opened this issue Oct 8, 2013 · 12 comments
Closed

<select multiple ng-options> do not support default/empty option #4325

martin-g opened this issue Oct 8, 2013 · 12 comments

Comments

@martin-g
Copy link

martin-g commented Oct 8, 2013

http://docs.angularjs.org/api/ng.directive:select shows an example (Color (null allowed)) of a select with ng-options and an option with empty value.

At http://plnkr.co/edit/dMKSt7P4ZPcWgBkpGvPI?p=preview I have an example that shows the functionality stops working if I add 'multiple' attribute to the select.

It also has plain select (not managed by Angular) that shows the empty value is supported for select.multiple.

@martin-g
Copy link
Author

martin-g commented Oct 8, 2013

This issue may be related to #3337 and #3230

siddii added a commit to siddii/angular.js that referenced this issue Jan 22, 2014
Removes a condition where static options are not added as part of render function when multiple attribute is enabled

Closes angular#4325
siddii added a commit to siddii/angular.js that referenced this issue Jan 22, 2014
Removes a condition where static options are not added as part of render function when multiple attribute is enabled

Closes angular#4325
@siddii
Copy link
Contributor

siddii commented Jan 22, 2014

Here is the plunkr for the fix showing it works - http://plnkr.co/edit/jDijgjJ0EZLFUGIkTKDs?p=preview

@martin-g
Copy link
Author

Confirmed!
Looks as desired!

@tbosch tbosch self-assigned this Feb 6, 2014
tbosch pushed a commit to tbosch/angular.js that referenced this issue Feb 6, 2014
…ions

Shows the static option for a not selected value in a select with
ngOption also when the multiple attribute is used.

Closes angular#4325
Closes angular#5938
@tbosch
Copy link
Contributor

tbosch commented Feb 6, 2014

Hi @martin-g,
as I think over it, this does not make sense.

In a drop down box, you need an additional element to unselect a previously selected value.
However, in a multiple select, you are able to unselect any element by pressing Ctrl+Click (Windows) or Command+Click (Mac). This should work in any browser and is the default behavior of HTML.

So why do you need that additional entry, what is your use case?

@tbosch
Copy link
Contributor

tbosch commented Feb 6, 2014

Closing this for now. Please comment if you have a usecase that I overlooked.

@tbosch tbosch closed this as completed Feb 6, 2014
@tbosch tbosch removed their assignment Feb 6, 2014
@martin-g
Copy link
Author

martin-g commented Feb 6, 2014

Hi @tbosch ,

I had to use it in a mobile/phone application.
It is not so easy to use Ctrl there.

@martin-g
Copy link
Author

C'mon, don't ignore the UX for mobile applications!

@tbosch
Copy link
Contributor

tbosch commented Feb 10, 2014

Hi,
mobile browsers have their own UI for select multiple.
iOS7 select multiple

Android 4.4 select multiple

I didn't check older browsers. If they don't do what you need you would need to create a workaround for them, as this would be a browser bug.

@geekmj
Copy link

geekmj commented May 8, 2014

This change is not available in any version of angular js. Why so?

@bretongoers
Copy link

@tbosch The unselect allows for nullable values if I have read the docs correctly. With multiple-select, the value is NOT nulled out when you deselect items. Instead it is set as an empty array.

In my situation, I needed to check these element's models for null to display certain items on screen. Because multiple-select is not nullable, I had to set a $watch on the relevant model to null it out when the array is empty. That might be a valid use-case for allowing an option that is nullable in a multiple-select.

Unless there is another way to do this better, it seems like a lot of trouble to set a $watch to null that value out

@tbosch
Copy link
Contributor

tbosch commented Jun 25, 2014

Well, you could check for an empty array, right?

@bretongoers
Copy link

Sure there are workarounds. Though in the context of what I was doing this in, I was using an ng-repeat with an ng-if to display several items from a model based on their value being null or populated. So it adds an extra, separate check for a very specific case because multi-select don't go to null.

I'm sure there are better ways of accomplishing it and there are obviously easy ways around it, just throwing it out there as a possibility :)

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

Successfully merging a pull request may close this issue.

5 participants