Question

What is a safe way to check that a listbox is empty in JQuery ? Alternative question, how to check if there is no item actively selected ?

I have tried :

if(...  .val() != "null")

also

if(...  .val() != null)

as I spotted null value on val() while debugging when the list is empty or nothing is selected, but doesn’t seem to work accurately.

Answer 1

To check if there are <option> elements inside the <select> element:

if ($('#my-select').children().length == 0) {
    alert('OH NO, there aren\'t any options to select!');
}

To check to see if an <option> inside the <select> has been selected (only works if selected <option> element has a value attribute)

if (typeof($('select').children(':checked').val()) == 'undefined') {
    alert('No Option with a Value Selected');
} 

Here is a demo: http://jsfiddle.net/sJdBJ/

Some Docs:

• typeof(): https://developer.mozilla.org/en/JavaScript/Reference/Operators/typeof
• .children(): http://api.jquery.com/children
• .length: http://api.jquery.com/length