CODEWITHSUNDEEP
jqueryinputmaxaddition
Cool Guy Yo
Cool Guy Yo

Reputation: 6110

Jquery input field addition, maximum total

I am trying to take this code and add one piece to it. I would like the #total to have a maximum number. I am not even sure how to approach this one. I have looked around the query documentation at adding a validation or something but it wasn't what I wanted. Any help would be greatly appreciated. http://jsfiddle.net/anderskitson/VVkzG/1/

JQUERY:

$('#the_input_id').keyup(function() {
    updateTotal();
});

$('#the_input_id1').keyup(function() {
    updateTotal();
});

var updateTotal = function() {
    var input1 = parseInt($('#the_input_id').val());
    var input2 = parseInt($('#the_input_id1').val());
    if (isNaN(input1) || isNaN(input2)) {
        $('#total').text('');
    } else {
        $('#total').text(input1 + input2);
    }
};​

Upvotes: 0

Views: 694

Answers (1)

Farzher
Farzher

Reputation: 14563

jsfiddle.net/VVkzG/2

HTML

<form method="post">
    <input type="text" id="the_input_id">
    <input type="text" id="the_input_id1">
</form>

</div>
<div id="total">

</div>​

Javascript

$('#the_input_id').keyup(function() {
    updateTotal();
});

$('#the_input_id1').keyup(function() {
    updateTotal();
});

var updateTotal = function() {
    var input1 = parseInt($('#the_input_id').val());
    var input2 = parseInt($('#the_input_id1').val());
    if (isNaN(input1) || isNaN(input2)) {
        $('#total').text('');
    } else {
        var max = 500;
        var total = input1 + input2;

        if(total > max) {
            $('#total').text('The maximum is '+max);
        } else {
             $('#total').text(total);
        }


    }
};​

Upvotes: 2

Related Questions