Comments on: Sum HTML Textbox Values using jQuery / JavaScript

By: Dilip

Dilip — Wed, 01 Feb 2012 09:35:35 +0000

thanks a lot

By: Mohammed Sabbir

Mohammed Sabbir — Wed, 01 Feb 2012 04:17:34 +0000

ok. i fix it.thnx

By: Mohammed Sabbir

Mohammed Sabbir — Wed, 01 Feb 2012 04:12:45 +0000

this is for .html(sum.toFixed(2)); but i want to put addition data to another textbox.when i do so using .val to going mad on me.how can i fix it.

By: Mohammed Sabbir

Mohammed Sabbir — Wed, 01 Feb 2012 03:56:23 +0000

Thanks a lot for your help.

By: Viral Patel

Viral Patel — Sun, 29 Jan 2012 16:39:57 +0000

Hi Dilip, You using two definitions of calculateSum() method. In this scenario, you can create two methods calculateSum1() and calculateSum2() method to tackle .txt and .txtt textboxes.

By: Dilip

Dilip — Sun, 29 Jan 2012 09:24:34 +0000

Hi Great script however how can i use two or more versions of the script on the same page. I tried the below code but doesn’t work can you please tell me how can i use more than two versions on same page by changing class and id’s on my input boxes and the code

var $ = jQuery.noConflict();
    $(document).ready(function(){

        //iterate through each textboxes and add keyup
        //handler to trigger sum event
        $(".txt") .each(function()
		  {

            $(this).keyup(function(){
                calculateSum();
            });
        });

    });

    function calculateSum() {

        var sum = 0;
        //iterate through each textboxes and add the values
        $(".txt").each(function() {

            //add only if the value is number
            if(!isNaN(this.value) && this.value.length!=0) {
                sum += parseFloat(this.value);
            }

        });
        //.toFixed() method will roundoff the final sum to 2 decimal places
        $(".sum").html(sum.toFixed(2));
    }

var $j = jQuery.noConflict();

    $j(document).ready(function(){

        //iterate through each textboxes and add keyup
        //handler to trigger sum event
        $j(".txtt") .each(function()
		  {

            $j(this).keyup(function(){
                calculateSum();
            });
        });

    });

    function calculateSum() {

        var sum = 0;
        //iterate through each textboxes and add the values
        $j(".txtt").each(function() {

            //add only if the value is number
            if(!isNaN(this.value) && this.value.length!=0) {
                sum += parseFloat(this.value);
            }

        });
        //.toFixed() method will roundoff the final sum to 2 decimal places
        $j(".teamb").html(sum.toFixed(2));
    }

By: Bobi

Bobi — Fri, 13 Jan 2012 13:15:41 +0000

Hi, I’m want to add in textbox values from mysql and get total sum, but in text filed not load data from $var ? Help please.
Thanks

By: Connor

Connor — Wed, 04 Jan 2012 15:33:08 +0000

None of the following work out on firefox..jquery is latest
inbox type textbox id sum name sum
value $(“#sum”).val(sum.toFixed(2)); or
$(“#sum”).html(sum.toFixed(2));

textbox display: $(

By: Viral Patel

Viral Patel — Mon, 02 Jan 2012 18:47:05 +0000

@Martin – This is because you might not have copied jQuery javascript file in your folder containing HTML. Well that’s not a problem. Just replace following line no. 19 in your HTML document:

with this one: