How to call javascript function on dynamically created html using jquery?

[technical_amit]

Hi guys, I am developing an invoice project. I am calculating amount of each section and assigning in grand total. For multiple invoice body section, I am adding dynamic html code using jquery append function. I am successfully added section and removed. When I added new invoice body on click on some link then its amount added into grand amount. Problem I am facing is that when I remove that html code after filling amount then I could not able to subtrack amount of that section from grand amount. I have created a function "setAmountMinus" and called it on remove form field but unfortunately no success. I am getting that amount that I am subtracting.

Please suggest if you have any solution. Thanks in advance..

function setAmount(invoice_bodyid,removeid)
{
    var quan=document.frm.quantity.value;
    var up=document.frm.unit_price.value;

    if(quan!="" && up!="")
    {
        var amt=quan*up;
        document.getElementById('amount').value=amt;
        document.getElementById('gross_total').value=amt;

        if(invoice_bodyid>0)
        {
            var amtnew=0; var grandtamt=0;

            for(var i=1;i<=invoice_bodyid;i++)
            {
                var newquan=document.getElementById('quantity'+i).value;
                var newup=document.getElementById('unit_price'+i).value;    
                amtnew=newquan*newup;

                document.getElementById('amount'+i).value=amtnew;
                var tamt=document.getElementById('amount'+i).value;
                grandtamt= parseInt(grandtamt)+parseInt(tamt);
            }   
            document.getElementById('gross_total').value=parseInt(grandtamt)+parseInt(amt);
        }
    }
}

var invoice_bodyid_total=0;
// code for adding more form 
function addFormField() 
{
    var invoice_bodyid = document.getElementById("invoice_bodyid").value;
    invoice_bodyid_total++;

$("#divTxt").append("<table cellpadding=\"0\" cellspacing=\"1\" id='invoicebody" + invoice_bodyid + "' align=\"center\" width=\"100%\" border=\"1\"><tr><td nowrap=\"nowrap\" width=\"30%\" class=\"admin_form_label\">Quantity : *</td><td class=\"admin_form_field\"><input type=\"text\" name=\"quantity"+invoice_bodyid+"\" id=\"quantity"+invoice_bodyid+"\" onblur='setAmount("+invoice_bodyid+");' /></td></tr><tr><td nowrap=\"nowrap\" width=\"30%\" class=\"admin_form_label\">Unit Price : *</td><td class=\"admin_form_field\"><input type=\"text\" name=\"unit_price"+invoice_bodyid+"\" id=\"unit_price"+invoice_bodyid+"\" class=\"unit_price\" onblur='setAmount("+invoice_bodyid+");' /></td></tr><tr><td nowrap=\"nowrap\" width=\"30%\" class=\"admin_form_label\">Amount :</td><td class=\"admin_form_field\" ><input type=\"text\" name=\"amount"+invoice_bodyid+"\" id=\"amount"+invoice_bodyid+"\" readonly=\"true\"/>   </td></tr><tr><td nowrap=\"nowrap\" width=\"30%\" class=\"admin_form_label\" colspan=\"2\" align=\"right\"><a href=\"#\" onClick='removeFormField(\"#invoicebody" + invoice_bodyid + "\","+ invoice_bodyid +"); return false;'>Remove</a></td></tr></table>");

    invoice_bodyid = (invoice_bodyid - 1) + 2;
    document.getElementById("invoice_bodyid").value = invoice_bodyid;
}


function setAmountMinus(invoice_bodyid,removeid)
{
    if(invoice_bodyid>0)
    {
        var amtnew=0; var grandtamt=0;
        for(var i=1;i<=invoice_bodyid;i++)
        {   
            if(i==removeid)
            {
                // problem is here.. it could not found value of i
                var rnewquan=document.getElementById("quantity"+i).value;
                var rnewup=document.getElementById("unit_price"+i).value;
                var ramtnew=rnewquan*rnewup;
            }
        }
        grandtamt=document.getElementById("gross_total").value;
        grandtamt=parseInt(grandtamt)-parseInt(ramtnew);
        document.getElementById("gross_total").value=grandtamt;
    }
}

function removeFormField(invoice_bodyid, removeid) 
{
    // remove html section
    $(invoice_bodyid).remove();
    // minus the amount of removed block
    setAmountMinus(invoice_bodyid_total,removeid);
}

[pritaeas]

First you remove the html, then you scan it for the amount. It would be wise to swap those two lines.

[technical_amit]

Thanks pritaeas,

Things working as it was a logical mistake..

Many thanks again
Amit

[pritaeas]

Please consider to mark this thread as solved.

[technical_amit]

Sure :-)