With Jquery, is there some way to make val() return an empty string instead of 'undefined' when called against an empty list of elements?

E.g., I have this code:

var x = $('#my-textbox-id').not('.watermark').val();

The idea is that I want to get the value of my textbox, but I want an empty string if it is currently showing the watermark (i don't want the watermark value!).

The selector works, but i don't want 'undefined' - I want an empty string ''.

With Jquery, is there some way to make val() return an empty string instead of 'undefined' when called against an empty list of elements?

E.g., I have this code:

var x = $('#my-textbox-id').not('.watermark').val();

The idea is that I want to get the value of my textbox, but I want an empty string if it is currently showing the watermark (i don't want the watermark value!).

The selector works, but i don't want 'undefined' - I want an empty string ''.

• javascript
• jquery

• 1 var x = $('#my-textbox-id').not('.watermark').val() || ''; – qwertymk Commented Dec 21, 2010 at 1:02

4 Answers 4

You can write (...).val() || "".

Only use this for text fields; it will also replace false or the number 0 with "".

Or you can use $.trim to get the expected result.

Example: $.trim($('#my-textbox-id').not('.watermark').val())

How about:

var x = $('#my-textbox-id').hasClass("watermark") ? "" : $('#my-textbox-id').val();

var x = $('#my-textbox-id').not('.watermark').val() == undefined 
? '' 
: $('#my-textbox-id').not('.watermark').val();