We're a community of 1076K IT Pros here for help, advice, solutions, professional growth and fun. Join us!
1,075,780 Members — Technology Publication meets Social Media
Username:
Password:
Lost login information?

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

0
By Amit Kumar Paliwal on Aug 2nd, 2010 3:11 pm

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);
}

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

pritaeas
Posting Prodigy
Moderator
9,265 posts since Jul 2006
Reputation Points: 1,173
Solved Threads: 1,456
Skill Endorsements: 86

Thanks pritaeas,

Things working as it was a logical mistake..

Many thanks again
Amit

technical_amit
Newbie Poster
4 posts since Aug 2010
Reputation Points: 10
Solved Threads: 0
Skill Endorsements: 0

Please consider to mark this thread as solved.

pritaeas
Posting Prodigy
Moderator
9,265 posts since Jul 2006
Reputation Points: 1,173
Solved Threads: 1,456
Skill Endorsements: 86

Sure :-)

technical_amit
Newbie Poster
4 posts since Aug 2010
Reputation Points: 10
Solved Threads: 0
Skill Endorsements: 0

Post: Markdown Syntax: Formatting Help
 
You
View similar articles that have also been tagged:
 
© 2013 DaniWeb® LLC
Page rendered in 0.0654 seconds using 2.67MB