Check if selected dropdown value is empty using jQuery

Question

Here is the dropdown in question:

<select name="data" class="autotime" id="EventStartTimeMin">
    <option value=""></option>
    <option value="00">00</option>
    <option value="10">10</option>
    <option value="20">20</option>
    <option value="30">30</option>
    <option value="40">40</option>
    <option value="50">50</option>
</select>

What I want to do is check if the current value is empty:

if ($("EventStartTimeMin").val() === "") {
   // ...
}

But it does not work, even though the value is empty. Any help is much appreciated.

Rory McCrossan · Accepted Answer · 2014-04-22 12:02:37Z

53

You forgot the # on the id selector:

if ($("#EventStartTimeMin").val() === "") {
    // ...
}

answered Apr 22, 2014 at 12:02

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Juanito Over a year ago

@RoryMcCrossan for .net if EventStartTimeMin where an asp.net control the code would be: if ($("#<%= EventStartTimeMin.ClientID %>").val() === "") { // ... }

Rory McCrossan Over a year ago

@Juanito I know, but how is that relevant to this question?

user2340939 Over a year ago

For the negation of the expression, just use !==, of course.

user2340939 Over a year ago

Also note that if the default selected option is disabled, the value of the select element will be null instead.

Rajat_Kumar_India · Accepted Answer · 2015-11-26 05:27:05Z

9

You can try this also-

if( !$('#EventStartTimeMin').val() ) {
// do something
}

answered Nov 26, 2015 at 5:27

Rajat_Kumar_India

991 silver badge2 bronze badges

1 Comment

user2340939 Over a year ago

This might not be desired, e.g. in case when 0 is a valid option value.

Felix · Accepted Answer · 2014-04-22 12:03:54Z

5

You need to use .change() event as well as using # to target element by id:

$('#EventStartTimeMin').change(function() {
    if($(this).val()===""){ 
        console.log('empty');    
    }
});

Fiddle Demo

answered Apr 22, 2014 at 12:03

Felix

38.2k8 gold badges45 silver badges56 bronze badges

2 Comments

WebDude0482 Over a year ago

The problem with just using change is that if the last field requires keyboard input, there is no change until the viewer clicks on something, leaving them befuddled. Use .on('change, keyup',function(){ }) instead.

user12417469 Over a year ago

Yeah i noticed you have to put it inside a change. But why doesn't it work without a change? Nice answer btw!

Collectives™ on Stack Overflow

Check if selected dropdown value is empty using jQuery

3 Answers 3

4 Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related