Angular select/ng-options with '' instead of null?

[Henrik Johansson]

Hi,

I'm wondering if it's possible to have a 

<select ng-model="query.city" ng-options="..."><option value="">-empty</option></select> 

That when "-empty" is selected makes query.city be '' (empty string) instead of null. Am I missing something?

 

I've put together a jsfiddle to show what I mean: http://jsfiddle.net/Qcyj7/7/

Thanks!

Henrik

[Peter Bacon Darwin]

You can "fix" it with a $parser...

http://jsfiddle.net/CB5um/

Henrik

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en-US.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Dave Merrill]

Does this strike anyone else as unexpected behavior, i.e., a bug? The option value is explicitly empty string, not null. 

Peter, your fix is clever and works, but it's remedial, restoring the normal behavior of HTML.You could attach that same directive to ngOptions instead, so it's used always, but it seems to me like this should be fixed in Angular core.

Dave Merrill

[Peter Bacon Darwin]

In angular the convention is that an input with no entry has a null model. If  "" is a valid option then why not add it to the list if options provided by ng-option?

Pete
...from my mobile.

[Dave Merrill]

Fair enough. I think of the blank first option hard-coded in the html as a way not to default to any value, as opposed to a legal value of blank, which I agree should be in the options.

Dave Merrill

[Henrik Johansson]

Thanks Peter, this worked very well for us. 

Henrik

[Peter Bacon Darwin]

You're welcome.

[Henrik Johansson]

-- I'm writing this to provide more insight into how we reason, and why we want to do it this particular way. -- 

We could very well add "" as an empty option, in the real case however we return a structure like this:

{"Sweden": ["Gothenburg", "Stockholm"], "Denmark": ["Copenhagen"]}. 

We have one dropdown to select the country, and then another for the city. However, city is optional. 

In this case we use the empty string to represent "absent" in the query. For us it's a simpler solution than using nulls to indicate absent (less code branching).

* We don't want to add "" to the list of cities returned server-side, as "" is not a city.

* We'd like to avoid making the controller unnecessarily complicated, just to add "" to the each list.

The preferred way for us would be to get the "" option declaratively in the template. Keeping these things declarative reduces the overall complexity and risk for bugs. 

So, the $parser solution solves this well.

Again, thanks.

Henrik

[Robert Schooley]

This post is highly ranked when searching for this, "issue", so I'd like to provide a little more detail.

By the reasoning above shouldn't we get a null value in this example: http://jsfiddle.net/8MYjx/

We get a value of "", which is not consistent with the other use case above.  This is still a source of confusion in 1.2.5.  

I would also say that a value="" isn't "no entry", it is a default entry that plays well with client side validation.

[Kumar R]

Hi,

I hope its useful.

refer link: http://argutech.blogspot.in/2013/10/create-calculator-application-use.html

and

http://jsfiddle.net/Kumar_Weblogicx/f3LkE/

Thanks to advance!

Visit this group at http://groups.google.com/group/angular.