3

Before anyone asks, I have already search existing questions and found this question, but the answer was that undefined was being set to null, which is not the case here.

Here is my code:

check_availability = function () {
    var value = $('#contact_type').val();
    if (value !== undefined) {
        // do some stuff
    }
}

Simple huh? I have a <select id="contact_type"></select> with options populated via ajaxy stuff. Initially the options list is empty, so the jQuery val() returns undefined. So far so good.

Except that the code within the if block always executes. I stick a breakpoint in FireBug on the 3rd line and I get this:

undefined weirdness

Can anyone tell me what's going on?

P.S. This is Firefox 4.0

EDIT: I know there are a number of ways I can achieve the same result, I'm more interested in why value is undefined according to FireBug, but then is !== undefined.

Community
  • 1
  • 1
stusherwin
  • 1,836
  • 19
  • 19

6 Answers6

3

Just check the truthiness of value.

if (value) {
    // sexy times
}

BTW, jQuery returns null, not undefined, when the <select> contains no <option>s. http://jsfiddle.net/mattball/cQ83z/

Matt Ball
  • 354,903
  • 100
  • 647
  • 710
  • Ok so the value of val() should actually be null. Is this a bug in FireBug then do you think? – stusherwin Apr 18 '11 at 14:18
  • No, see ThiefMaster's answer: your watch point has `value == undefined` as `true` (which makes sense since `null == undefined`) but `value === undefined` as `false` (which makes sense because `null !== undefined`). If you want to see the actual value, use a proper breakpoint or `console.log(value)`. – Matt Ball Apr 18 '11 at 14:19
  • But I also get `undefined` for the watch of just `value` – stusherwin Apr 18 '11 at 14:20
  • As ThiefMaster commented: "Sounds to me like the line assigning something to it wasn't executed yet." – Matt Ball Apr 18 '11 at 14:21
  • You can't just check for truthiness if `value` can legally be `0`, as might be the case here. – Marcel Korpel Apr 18 '11 at 14:52
  • @Marcel: `val()` returns a string, not a number, and although the _number_ `0` is falsy, the _string_ `'0'` is truthy. Try it in your console: `!!'0'` prints `true`. – Matt Ball Apr 18 '11 at 14:53
  • 1
    Ah, I didn't know about `val()` returning a string. However, `"" == false` (if `val()` can return an empty string). – Marcel Korpel Apr 18 '11 at 14:57
  • @Marcel: yes, `val()` can return the empty string. Now _that's_ a valid point. – Matt Ball Apr 18 '11 at 15:00
2

The val() is never undefined: http://jsfiddle.net/ThiefMaster/UmZhG/

If the <select> has no options, it is null; otherwise there's always an option selected.

Fyi, value == undefined is true since null == undefined (even though null !== undefined)

ThiefMaster
  • 310,957
  • 84
  • 592
  • 636
  • ... did you see the bit where value is undefined in the FireBug screenshot? – stusherwin Apr 18 '11 at 14:03
  • 1
    @Stuart: see my answer. jQuery tends to avoid returning `undefined`. – Matt Ball Apr 18 '11 at 14:04
  • Sounds to me like the line assigning something to it wasn't executed yet. A `var x` defined in a function will be undefined until its the first assignment. – ThiefMaster Apr 18 '11 at 14:04
  • What do you mean by it being undefined until its the first assignment? Isn't it the first assignment? – stusherwin Apr 18 '11 at 14:28
  • Internally no matter where `var x = something;` occurs, every occurence creates `var x;` at the beginning of the function. So the var is defined in the whole function, but only after the first assignment it loses its `undefined` value. – ThiefMaster Apr 18 '11 at 16:25
  • Ok I knew that, but this doesn't apply in my case, because the var `value` is defined and initialised at the same time (see code). So what I'm asking is, how can this happen? – stusherwin Apr 19 '11 at 08:57
  • If you stepped right into the function (i.e. the debugger is on the `var x = something` line), the line has not been executed yet. However, the var is already defined (with its value being `undefined`) at this point. – ThiefMaster Apr 19 '11 at 09:20
  • No, this was after I had stepped past it and the debugger was on the next line! – stusherwin Apr 19 '11 at 09:27
1

Try this:

if (typeof(value) != 'undefined') {
    // do some stuff
}

Hope that helps.

Niloct
  • 9,491
  • 3
  • 44
  • 57
  • Sorry, my answer was correct but doesn't solve your problem. If I understood, you want to do some action ONLY if there are no `option` tags inside the `select` element, right ? If so, try this: `if ($('#contact_type option').size() > 0) { /* there are options */}`. Also I am assuming you have a a real `` there, instead of what you typed. – Niloct Apr 18 '11 at 14:39
1

the === operator doesn't do type conversions which may causing the error. try == instead. or compare against null.

Jason
  • 15,915
  • 3
  • 48
  • 72
1

try in this way...

if (value != undefined) {
        // do some stuff
    }
Vivek
  • 10,978
  • 14
  • 48
  • 66
0

Use this:

if($("#contact_type").val() != ""){
//does have a value
}else{
//No value there
}
Naveed Ahmad
  • 3,176
  • 1
  • 15
  • 18