在asp.net c#中使用javaScript/jquery客户端进行gridview计算
本文关键字：客户端 jquery 计算 gridview javaScript net asp | 更新日期: 2023-09-27 18:00:59
我在网格视图中有两个网格视图，其中页脚显示总价和税款，所有网格视图中的总总额显示在网格视图1页脚中
<asp:TemplateField HeaderText="Category">
<ItemTemplate>
<asp:Label ID="lblcategoryname" runat="server" Text='<%#Eval("ItemName")%>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
Gross Total
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Select Products">
<ItemTemplate>
<table width="100%">
<tr>
<td>
<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="false" ShowFooter="true">
<Columns>
<asp:TemplateField HeaderText="ItemName">
<ItemTemplate>
<asp:Label ID="lblItemName" runat="server" Text='<%#Eval("ItemName")%>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Price">
<ItemTemplate>
<asp:Label ID="lblprice" runat="server" Text='<%#Eval("Price")%>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="tax">
<ItemTemplate>
<asp:Label ID="lbltax" runat="server" Text='<%#Eval("tax")%>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Quantity">
<ItemTemplate>
<asp:TextBox ID="txtCalcQuantity" runat="server" Text='<%#Eval("Quantity")%>' />
</ItemTemplate>
<FooterTemplate>
Total
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Total">
<ItemTemplate>
<asp:Label ID="lblTotal" runat="server" Text="0"></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="lblGrossTotal" runat="server" Text="0"></asp:Label>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Total tax">
<ItemTemplate>
<asp:Label ID="lblTotaltax" runat="server" Text="0"></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="lblGrossTotaltax" runat="server" Text="0"></asp:Label>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</td>
</tr>
</table>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="lblGrossTotal" runat="server" Text="0"></asp:Label>
<asp:Label ID="lblGrossTotaltax" runat="server" Text="0"></asp:Label>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
但我的问题是获得相同的页脚值，但我们需要每个内部网格(GridView2(和主网格(GridView 1(中的总合计的单独合计和税收
我已经为2个Gridview中的CheckBox完成了操作。您可以根据您的需求使用Textbox编辑它//JavaScript
<script type="text/javascript">
function CheckAll(HeaderCheckBox,chkItem,gView)
{
var gv=document.getElementById(gView.id);
//alert(gv.id.replace("_ctl01_HeaderCheckBox",""));
var _hoursGrid=gv.id.replace("_ctl01_HeaderCheckBox","");
//alert(document.getElementById(gv.id.replace("_ctl01_HeaderCheckBox","")).rows.length);
//alert(gv.id.replace("HeaderCheckBox","SelectCheckBox"));
var len=document.getElementById(_hoursGrid).rows.length;
//alert(document.getElementById(gv.id));
if(document.getElementById(gv.id).checked)
{
// alert("p");
for(var i=2;i<=len;i++)
{
if(i<10)
{
// alert(_hoursGrid+'_ctl0'+i+'_'+chkItem);
document.getElementById(_hoursGrid+'_ctl0'+i+'_'+chkItem).checked=true;
}
else
{
document.getElementById(_hoursGrid+'_ctl'+i+'_'+chkItem).checked=true;
}
}
}
else
{
for(var i=2;i<=len;i++)
{
if(i<10)
{
document.getElementById(_hoursGrid+'_ctl0'+i+'_'+chkItem).checked=false;
}
else
{
document.getElementById(_hoursGrid+'_ctl'+i+'_'+chkItem).checked=false;
}
}
}
}
</script>
<ItemTemplate>
<table cellpadding="0" cellspacing="0" width="100%" class="border_bottom_none">
<tr height="20px" class="baground_none">
<td align="left" style="background-color: White; color: Black;">
<asp:Label ID="DateLabel" runat="server" Text='<%# String.Format("{0:D}", Eval("Date")) %>'
Font-Size="11px"></asp:Label>
<asp:HiddenField ID="DateHiddenField" runat="server" Value='<%# String.Format("{0:d}", Eval("Date")) %>' />
</td>
</tr>
<tr>
<td>
<asp:GridView ID="HoursGridView" Width="100%" PagerStyle-HorizontalAlign="Center"
AllowPaging="false" EmptyDataText="No records found" EmptyDataRowStyle-HorizontalAlign="Center"
BorderWidth="0" runat="server" AutoGenerateColumns="false" CssClass="grid_body floatingtalbe">
<HeaderStyle CssClass="grid" />
<RowStyle CssClass="grid_text" />
<PagerStyle CssClass="manag_user_num" />
<AlternatingRowStyle CssClass="grid_box_colr" />
<Columns>
<asp:TemplateField ItemStyle-Width="2%" ItemStyle-CssClass="text_box_req">
<HeaderTemplate>
<asp:CheckBox ID="HeaderCheckBox" runat="server" onClick="CheckAll('HeaderCheckBox','SelectCheckBox',this);" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="SelectCheckBox" runat="server" OnCheckedChanged="SelectCheckBox_CheckedChanged"
AutoPostBack="true" />
<asp:HiddenField ID="JobIdHiddenField" runat="server" Value='<%# Eval("Job_Id") %>' />
<asp:HiddenField ID="EmployeeHiddenField" runat="server" Value='<%# Eval("Employee_Id") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField HeaderText="Job #" DataField="Job_Number" ItemStyle-CssClass="color_black" />
</Columns>
</asp:GridView>
</td>
</tr>
</table>
</ItemTemplate>
</asp:TemplateField>
这是我的要求//JavaScript
<script type="text/javascript">
function funcsum() {
var table = document.getElementById("GridView1");
var Taxsum = 0, pricesum = 0;
for (var i = 1; i < table.rows.length; i++) //setting the incrementor=0, but if you have a header set it to 1
{
if (i != (table.rows.length - 1)) {
var gvname = 'GridView1_GridView2_' + (i - 1);
var subtable = document.getElementById(gvname);
var totTax = 0, totamount = 0;
for (var j = 1; j < subtable.rows.length; j++) {
if (j != (subtable.rows.length - 1)) {
var Tax = 'GridView1_GridView2_' + (i - 1) + '_lbltax_' + (j - 1);
var lbltax = document.getElementById(Tax).innerHTML;
var dpprice = 'GridView1_GridView2_' + (i - 1) + '_lblprice_' + (j - 1);
var lblprice = document.getElementById(dpprice).innerHTML;
var Quantity = 'GridView1_GridView2_' + (i - 1) + '_txtQuantity_' + (j - 1);
var txtQuantity = document.getElementById(Quantity).value;
var totalTax = 'GridView1_GridView2_' + (i - 1) + '_lblTotaltax_' + (j - 1);
var lbltotalTax = document.getElementById(totalTax).innerHTML;
var totamt = 'GridView1_GridView2_' + (i - 1) + '_lblTotal_' + (j - 1);
var lblTotal = document.getElementById(totamt).innerHTML;
if (isNaN(txtQuantity) || txtQuantity == '') {
txtQuantity = 0;
document.getElementById(Quantity).value = txtQuantity;
}
lbltotalTax = (parseFloat(lbltax) * parseFloat(txtQuantity)).toString();
lblTotal = (parseFloat(lblprice) * parseFloat(txtQuantity)).toString();
document.getElementById(totalTax).innerHTML = lbltotalTax;
document.getElementById(totamt).innerHTML = lblTotal;
totTax = totTax + parseFloat(lbltotalTax);
totamount = totamount + parseFloat(lblTotal);
}
else {
var lbl_totalTax = document.getElementById('GridView1_GridView2_' + (i - 1) + '_lblGrossTotaltax').innerHTML;
var lblGrossTotal = document.getElementById('GridView1_GridView2_' + (i - 1) + '_lblGrossTotal').innerHTML;
lbl_totalTax = totTax;
lblGrossTotal = totamount;
document.getElementById('GridView1_GridView2_' + (i - 1) + '_lblGrossTotaltax').innerHTML = totTax;
document.getElementById('GridView1_GridView2_' + (i - 1) + '_lblGrossTotal').innerHTML = totamount;
}
}
Taxsum = Taxsum + parseFloat(totTax);
pricesum = pricesum + parseFloat(totamount);
}
else {
document.getElementById('GridView1_lblGrossTotaltax').innerHTML = Taxsum;
document.getElementById('GridView1_lblGrossTotal').innerHTML = pricesum;
}
}
}
</script>
<asp:TemplateField HeaderText="Category">
<ItemTemplate>
<asp:Label ID="lblcategoryname" runat="server" Text='<%#Eval("ItemName")%>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
Gross Total
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Select Products">
<ItemTemplate>
<table width="100%">
<tr>
<td>
<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="false" ShowFooter="true">
<Columns>
<asp:TemplateField HeaderText="ItemName">
<ItemTemplate>
<asp:Label ID="lblItemName" runat="server" Text='<%#Eval("ItemName")%>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Price">
<ItemTemplate>
<asp:Label ID="lblprice" runat="server" Text='<%#Eval("Price")%>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="tax">
<ItemTemplate>
<asp:Label ID="lbltax" runat="server" Text='<%#Eval("tax")%>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Quantity">
<ItemTemplate>
<asp:TextBox ID="txtQuantity" runat="server" Text='<%#Eval("Quantity")%>' onchange="funcsum()" />
</ItemTemplate>
<FooterTemplate>
Total
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Total">
<ItemTemplate>
<asp:Label ID="lblTotal" runat="server" Text="0"></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="lblGrossTotal" runat="server" Text="0"></asp:Label>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Total tax">
<ItemTemplate>
<asp:Label ID="lblTotaltax" runat="server" Text="0"></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="lblGrossTotaltax" runat="server" Text="0"></asp:Label>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</td>
</tr>
</table>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="lblGrossTotal" runat="server" Text="0"></asp:Label>
<asp:Label ID="lblGrossTotaltax" runat="server" Text="0"></asp:Label>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>