I am having trouble with trying to check the length of a field and set a value based on the result. Using firebug with firefox I keep getting the error 'elUsername' is not defined. Please tell me what I am doing wrong. Fairly new to JQuery.

$('#usernameInput').blur(function ()
{
    var elUsername = $('#usernameInput').value;
    var elUsernameFeedback = $('#usernameFeedback');
    if (elUsername.length < 5) {
        elUsernameFeedback.text("Please enter your username");
    }
});

Basically when the user leaves the field and the username is less than 5 (just for testing) the gets the text set to it to prompt the user to correct the mistake. However the if statement is never entered. Any help would be greatly appreciated.

I am having trouble with trying to check the length of a field and set a value based on the result. Using firebug with firefox I keep getting the error 'elUsername' is not defined. Please tell me what I am doing wrong. Fairly new to JQuery.

$('#usernameInput').blur(function ()
{
    var elUsername = $('#usernameInput').value;
    var elUsernameFeedback = $('#usernameFeedback');
    if (elUsername.length < 5) {
        elUsernameFeedback.text("Please enter your username");
    }
});

Basically when the user leaves the field and the username is less than 5 (just for testing) the gets the text set to it to prompt the user to correct the mistake. However the if statement is never entered. Any help would be greatly appreciated.

• javascript
• jquery

Share Improve this question Follow edited Aug 16, 2014 at 18:38 user2864740 62.1k1515 gold badges158158 silver badges228228 bronze badges asked Aug 16, 2014 at 18:18 Luke StowardLuke Stoward 1,5401515 silver badges2525 bronze badges 1

• The error message doesn't lie. Note how much more relevant the updated title is. – user2864740 Commented Aug 16, 2014 at 18:38

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 7

You're trying to use a native JavaScript property on a jQuery object. Use :

var elUsername = $('#usernameInput').val();

or

var elUsername = document.getElementById('usernameInput').value;

or the slightly less obvious, but still valid:

var elUsername = $('#usernameInput')[0].value;
var elUsername = $('#usernameInput').get(0).value;

try this

var elUsername = $('#usernameInput').val();

Instead of

var elUsername = $('#usernameInput').value;

Change those variables to this:

var elUsername = $('#usernameInput').val();