I added checkbox in my webpage using:
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkRow" runat="server" />
</ItemTemplate>
</asp:TemplateField>But then my calculation of price*quantity having error where it display the total in another column and row.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function CalculateTotals() {
var gv = document.getElementById("<%= GridView1.ClientID %>");
var tb = gv.getElementsByTagName("input");
var lb = gv.getElementsByTagName("span");
var sub = 0;
var total = 0;
var indexQ = 1;
var indexP = 0;
var price = 0;
for (var i = 0; i < tb.length; i++) {
if (tb[i].type == "text") {
ValidateNumber(tb[i]);
price = lb[indexP].innerHTML.replace("$", "").replace(",", "");
sub = parseFloat(price) * parseFloat(tb[i].value);
if (isNaN(sub)) {
lb[i + indexQ].innerHTML = "0.00";
sub = 0;
}
else {
lb[i + indexQ].innerHTML = FormatToMoney(sub, "$", ",", "."); ;
}
indexQ++;
indexP = indexP + 2;
total += parseFloat(sub);
}
}
lb[lb.length - 1].innerHTML = FormatToMoney(total, "$", ",", ".");
}
function ValidateNumber(o) {
if (o.value.length > 0) {
o.value = o.value.replace(/[^\d]+/g, ''); //Allow only whole numbers
}
}
function isThousands(position) {
if (Math.floor(position / 3) * 3 == position) return true;
return false;
};
function FormatToMoney(theNumber, theCurrency, theThousands, theDecimal) {
var theDecimalDigits = Math.round((theNumber * 100) - (Math.floor(theNumber) * 100));
theDecimalDigits = "" + (theDecimalDigits + "0").substring(0, 2);
theNumber = "" + Math.floor(theNumber);
var theOutput = theCurrency;
for (x = 0; x < theNumber.length; x++) {
theOutput += theNumber.substring(x, x + 1);
if (isThousands(theNumber.length - x - 1) && (theNumber.length - x - 1 != 0)) {
theOutput += theThousands;
};
};
theOutput += theDecimal + theDecimalDigits;
return theOutput;
}
function Validate(sender, args) {
var gv = document.getElementById("<%= GridView1.ClientID %>");
var checkBoxes = gv.getElementsByTagName("input");
for (var i = 0; i < checkBoxes.length; i++) {
if (checkBoxes[i].type == "checkbox" && checkBoxes[i].checked) {
args.IsValid = true;
return;
}
}
args.IsValid = false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:gridview ID="GridView1" runat="server" ShowFooter="true" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkRow" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="RowNumber" HeaderText="Row Number" />
<asp:BoundField DataField="Description" HeaderText="Item Description" />
<asp:TemplateField HeaderText="Item Price">
<ItemTemplate>
<asp:Label ID="LBLPrice" runat="server" Text='<%# Eval("Price","{0:C}") %>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
<b>Total Qty:</b>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Quantity">
<ItemTemplate>
<asp:TextBox ID="TXTQty" runat="server" onkeyup="CalculateTotals();"></asp:TextBox>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="LBLQtyTotal" runat="server" Font-Bold="true" ForeColor="Blue" Text="0" ></asp:Label>
<b>Total Amount:</b>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Sub-Total">
<ItemTemplate>
<asp:Label ID="LBLSubTotal" runat="server" ForeColor="Green" Text="0.00"></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="LBLTotal" runat="server" ForeColor="Green" Font-Bold="true" Text="0.00"></asp:Label>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:gridview>
</div>
</form>
</body>
</html>For my code behind:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
namespace SystemTesting
{
public partial class product : System.Web.UI.Page
{
private void BindDummyDataToGrid()
{
DataTable dt = new DataTable();
DataRow dr = null;
dt.Columns.Add(new DataColumn("No"));
dt.Columns.Add(new DataColumn("RowNumber", typeof(string)));
dt.Columns.Add(new DataColumn("Description", typeof(string)));
dt.Columns.Add(new DataColumn("Price", typeof(string)));
dr = dt.NewRow();
dr["No"] = "";
dr["RowNumber"] = 1;
dr["Description"] = "Nike";
dr["Price"] = "1000";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["No"] = "";
dr["RowNumber"] = 2;
dr["Description"] = "Converse";
dr["Price"] = "800";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["No"] = "";
dr["RowNumber"] = 3;
dr["Description"] = "Adidas";
dr["Price"] = "500";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["No"] = "";
dr["RowNumber"] = 4;
dr["Description"] = "Reebok";
dr["Price"] = "750";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["No"] = "";
dr["RowNumber"] = 5;
dr["Description"] = "Vans";
dr["Price"] = "1100";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["No"] = "";
dr["RowNumber"] = 6;
dr["Description"] = "Fila";
dr["Price"] = "200";
dt.Rows.Add(dr);
//Bind the GridView
GridView1.DataSource = dt;
GridView1.DataBind();
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindDummyDataToGrid();
}
}
}
}