Jump to content
lovephp

Help get values of total addition and total substraction

Recommended Posts


<html>
<head>
<title>Sum Html Textbox Values using jQuery/JavaScript</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$(function() {
$(document).on('blur keyup', '.add, .sub', function(e) {
var sum = 0;
$('.add, .sub').each(function(i) {
if (!isNaN(this.value) && this.value.length != 0) {
if ($(this).hasClass('add')) {
sum += parseFloat(this.value);
}
else {
sum -= parseFloat(this.value);
}
}
});
$('#total').text(sum.toFixed(2));
})
})
</script>
</head>
<body>
<form method="post" action="calc.php">
Addition:
<br/>
Field 1: <input type="text" class="add" name="1" value="7500"/><br/>
Field 2: <input type="text" class="add" name="2" value=""/><br/>
Field 3: <input type="text" class="add" name="3" value=""/><br/>
Field 4: <input type="text" class="add" name="4" value=""/><br/><br/>
Total Addition:
<br/><br/>
Substraction:
<br/>
Field 1: <input type="text" class="sub" name="5" value=""/><br/>
Field 2: <input type="text" class="sub" name="6" value=""/><br/>
Field 3: <input type="text" class="sub" name="7" value=""/><br/>
Field 4: <input type="text" class="sub" name="8" value=""/><br/><br/>
Total Substraction:
<br/><br/>
Grand Total: <div id="total"></div>
<input type="submit" value="submit" />
</form>
</body>
</html>

 

Share this post


Link to post
Share on other sites

Do you have a question?

Share this post


Link to post
Share on other sites

yes ofcourse, im trying to get the total substraction output as say field 1 i add 500 and field 2 i add 100 the the output should be 600

 

i have run it here http://jsfiddle.net/KXGEY/8/ all works fine except the total substraction part.

Edited by lovephp

Share this post


Link to post
Share on other sites

Both the addition and subtraction 'appear' to be working correctly for me. But, again, you have not stated any problem. If your problem is important enough that you need a resolution, at least take the time to adequately explain what it is you are trying to accomplish, what problem you are having (e.g. what isn't working correct and any errors you are getting), and what you have tried thus far to resolve and the results.

$(function() {
    $(document).on('blur keyup', '.add, .sub', function(e) {
        var add = 0;
        var sub = 0;
        var sum = 0;
        $('.add').each(function(i) {
            if (!isNaN(this.value) && this.value.length != 0) {
                add += parseFloat(this.value);
            }
        });
        $('.sub').each(function(i) {
            if (!isNaN(this.value) && this.value.length != 0) {
                sub += parseFloat(this.value);
            }
        });
        sum = add - sub;
        $('#totaladd').text(add.toFixed(1));
        $('#totalsub').text(sub.toFixed(1));
        $('#total').text(sum.toFixed(2));
    })
})
Edited by Psycho

Share this post


Link to post
Share on other sites

sorry for my bad english i really am not good at asking questions nor explaining dunno why :) but cheers u got me right and now i get what i was looking for :)

 

one last help bro i need to get the values of <label id="totaladd"></label> and <label id="totalsub"></label> and <label id="total"></label> in some input field aswell i think it could be done by hidden field but not getting the right way to do it. maybe you could help me achieve it too?

Share this post


Link to post
Share on other sites

Then don't put the output into LABELs and instead put them into read-only input fields. If you don't want them to "look" like input fields then remove the border via CSS: http://jsfiddle.net/KXGEY/12/

 

 

But . . . why would you need to do this? You should NOT be passing the calculated values in your POST data. You should recalculate on the server-side. Never trust any input coming from the user. They can manipulate anything on the form.

  • Like 1

Share this post


Link to post
Share on other sites

oh yes bro server side through php am rechecking, this is only for users to see the calculated results. btw thumbs up to u i had been trying to sort this for hours :)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.