sum of values in input boxes using jquery not working

Question

I am creating a form that takes values from a hash and creates three input boxes(having class amount, acNo,debNo) per key name attribute combination of the hash value and a string bed in my case now i am trying to get the sum of the values in input boxes having "bed" in their name and have class "amount".

 $(document).ready(function(){
 alert('document is loaded');
    $("input[name*='bed'][class='amount']").each(function() {//doen't go in this loop

        alert('in the bed'); //no alert
            $(this).keyup(function(){

                calculateSum();
            });
        });

    });

    function calculateSum() {

        var sum = 0;
        //iterate through each textboxes and add the values
        $("input[name*='bed'][class='amount']").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
        $("input[name='totalBEDamount']").val(sum.toFixed(2));
    }

I am using the above jquery to get sum of values. The problem is that it works fine as fixed layout fixed layout fiddle but when i am creating the document on radio button selection from a hash the code fiddle with error doesn't work? Why???

This could help http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements — lastr2d2, Oct 21 '13 at 04:48

score 3 · Accepted Answer · answered Oct 21 '13 at 04:42

Use [class='amount'] and use on() (for your dynamically created elements) in place of [class='column'] like,

$(document).ready(function () {
     $(document).on('keyup',"input[name*='bed'][class='amount']", function () {
         var sum = 0;
         //iterate through each textboxes and add the values
         $("input[name*='bed'][class='amount']").each(function () {
             //add only if the value is number
             if (!isNaN(this.value) && this.value.length != 0) {
                 sum += parseFloat(this.value);
             }

         });
         $("input[name='totalBEDamount']").val(sum.toFixed(2));
     });
});

Working Demo

thanks a lot man...no need to say it worked. Yeah I made a mistake in class name but the real was that I was not using on() for dynamically created object. — norbdum, Oct 21 '13 at 04:54

sum of values in input boxes using jquery not working

1 Answers1