I have Textboxes inside Datalist control . one for Price , Quantity and third one is for Total i want to as user insert price and Quatity then total will be calculated automatically based upon data provided. i tired the below but it is not working
var gv = document.getElementById("<%= Datalist1.ClientID %>");
var tb = gv.getElementsByTagName("input");
var sub = 0;
var total = 0;
//Loop on TextBoxes that how many Textboxes are there???
for (var i = 0; i < tb.length; i++) {
// Check if it is Textbox
if (tb[i].type == "text") { // Here how i get the Particular Textbox like price , Quatity and txtTtoal for calculation ??????
}
Any idea i have Textboxes inside ItemTemplate of the DataList control
Regards
life is name of learning!
Mark as an answer if it helps
Rameezwaheed
Contributor
3730 Points
1595 Posts
Calcualting GrandTotal Error
Apr 01, 2011 12:19 PM|LINK
Hi all,
I have Textboxes inside Datalist control . one for Price , Quantity and third one is for Total i want to as user insert price and Quatity then total will be calculated automatically based upon data provided. i tired the below but it is not working
var gv = document.getElementById("<%= Datalist1.ClientID %>"); var tb = gv.getElementsByTagName("input"); var sub = 0; var total = 0; //Loop on TextBoxes that how many Textboxes are there??? for (var i = 0; i < tb.length; i++) { // Check if it is Textbox if (tb[i].type == "text") { // Here how i get the Particular Textbox like price , Quatity and txtTtoal for calculation ?????? }Any idea i have Textboxes inside ItemTemplate of the DataList control
Regards
Mark as an answer if it helps
asteranup
All-Star
30184 Points
4906 Posts
Re: Calcualting GrandTotal Error
Apr 01, 2011 12:56 PM|LINK
Hi,
Check this-
HTML-
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Untitled Page</title> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { var total = 0; $("input[id*=Quantity]").keyup(function() { var q = parseFloat($(this).val()); if (isNaN(q)) q = 0; var price = parseFloat($(this).closest("tr").find("span[id*=Price]").html()); $(this).closest("tr").find("span[id*=TotalAmount]").html(q * price); calculateGrandTotal(); }); calculateTotal(); }); function calculateTotal() { $("input[id*=Quantity]").each(function(index, item) { tempQuantity = parseFloat($(item).val()); if (isNaN(tempQuantity)) tempQuantity = 0; var price = parseFloat($(item).closest("tr").find("span[id*=Price]").html()); $(this).closest("tr").find("span[id*=TotalAmount]").html(tempQuantity * price); }); calculateGrandTotal(); } function calculateGrandTotal() { total = 0; $("span[id*=TotalAmount]").each(function(index, item) { tempAmount = parseFloat($(item).html()); if (isNaN(tempAmount)) tempAmount = 0; total = total + tempAmount; }); $("span[id*=GrandTotal]").html(total); } </script> </head> <body> <form id="form1" runat="server"> <asp:DataList ID="dlMinistry" runat="server" > <ItemTemplate> <div style="width:400px;text-align:right"> Quantity: <asp:TextBox ID="Quantity" runat="server" Text='<%# Bind("Quantity") %>'></asp:TextBox> Price: <asp:Label ID="Price" runat="server" Text='<%# Bind("Price") %>' ></asp:Label> Total: <asp:Label ID="TotalAmount" runat="server" ></asp:Label> </div> </ItemTemplate> <FooterTemplate> <div style="width:400px;text-align:right"> Grand Total: <asp:Label ID="GrandTotal" runat="server" ></asp:Label> </div> </FooterTemplate> </asp:DataList> </form> </body> </html>Code-protected void Page_Load(object sender, EventArgs e) { var list = (new[]{new{Quantity=1, Price=300}, new{Quantity=2, Price=400}, new{Quantity=3, Price=500}, new{Quantity=4, Price=600}, new{Quantity=5, Price=700}, new{Quantity=6, Price=800}}).ToList(); dlMinistry.DataSource = list; dlMinistry.DataBind(); }Anup Das Gupta
Mark as Answer if you feel so. Visit My Blog