Question

I want to validate user-input. If the number user has entered is greater than 3, then it should throw error ‘Too high’, if it is lesser than 0.15, then ‘Too low’. If it’s between 3 and 0.15, then it should show ‘Okay’.

The problem with my code is that if the user has entered a negative value, it still shows ‘Okay’ to him. It seems regardless of what the user enters, it shows ‘Okay’.

This is the code:

$('#submit').click(function(e) {
        vel = $('#vel').val();
        validVel(vel);
});

function validVel(v) {

    if (v > 3) {
        $('.er').fadeIn(2000);
        var error = "Too High";
        $('.er').text(error);   
    }
    else if (v < 0.15) {
        $('.er').fadeIn(2000);
        var error = "Too Low";
        $('.er').text(error);   
    }
    else {
        $('.er').fadeIn(2000);
        var error = "Okay";
        $('.er').text(error);
    }


}

Answer 1

You need a parseFloat in your function to ensure the equality checks are valid. As pointed out by WilQu you should also include an isNaN test –

function validVel(v) {

    fv = parseFloat(v);

    if (fv > 3) {
        $('.er').fadeIn(2000);
        var error = "Too High";
        $('.er').text(error);   
    }
    else if (fv < 0.15) {
        $('.er').fadeIn(2000);
        var error = "Too Low";
        $('.er').text(error);   
    }
    else if (isNaN(fv)) {
        $('.er').fadeIn(2000);
        var error = "Not a number";
        $('.er').text(error);   
    }   
    else {
        $('.er').fadeIn(2000);
        var error = "Okay";
        $('.er').text(error);
    }
} 

Demo – http://jsfiddle.net/AyhRS/7