ASPForums.Net RSS Feedhttp://www.aspforums.net/Handlers/RSS.ashxLatest additions to the content that appears on ASPForums.Net(c) 2019 www.aspforums.com. All rights reserved.Display ASP.Net GridView row total in Footer using jQuery<p>Hey <a class="username" rel="Warren"> Warren</a>,</p> <p>Please refer below sample.</p> <p><span style="text-decoration: underline;"><strong>HTML</strong></span></p> <pre class="brush: html">script type=&#34;text/javascript&#34;&gt; $(function () { var grandTotal = 0; $(&#39;#gvtfaLoan&#39;).find(&#39;tr:has(td)&#39;).each(function (i) { if (i &lt; $(&#39;[id$=gvtfaLoan]&#39;).find(&#39;tr:has(td)&#39;).length - 1) { grandTotal += parseFloat($(this).find(&#39;[id*=TextAmount]&#39;).val()); } }); $(&#39;#gvtfaLoan&#39;).find(&#39;tr:has(td)&#39;).find(&#39;[id*=lblTotal]&#39;)[0].innerHTML = grandTotal; }); &lt;/script&gt; &lt;div&gt; &lt;asp:GridView ID=&#34;gvtfaLoan&#34; runat=&#34;server&#34; AutoGenerateColumns=&#34;False&#34; DataKeyNames=&#34;ID&#34; ShowFooter=&#34;True&#34; AllowSorting=&#34;False&#34; CssClass=&#34;table table-striped table-bordered table-hover&#34; Width=&#34;98%&#34; HorizontalAlign=&#34;Center&#34;&gt; &lt;Columns&gt; &lt;asp:BoundField DataField=&#34;ID&#34; HeaderText=&#34;0. ID&#34; ShowHeader=&#34;false&#34; HeaderStyle-Wrap=&#34;false&#34; SortExpression=&#34;ID&#34; /&gt; &lt;asp:BoundField DataField=&#34;CheckDate&#34; HeaderText=&#34;1. Check Date&#34; ShowHeader=&#34;false&#34; HeaderStyle-Wrap=&#34;false&#34; DataFormatString=&#34;{0:dd, MMM yyyy}&#34; SortExpression=&#34;CheckDate&#34; /&gt; &lt;asp:BoundField DataField=&#34;BorrowerName&#34; HeaderText=&#34;2. Borrower Name&#34; ShowHeader=&#34;false&#34; HeaderStyle-Wrap=&#34;false&#34; SortExpression=&#34;BorrowerName&#34; /&gt; &lt;asp:BoundField DataField=&#34;CheckNo&#34; HeaderText=&#34;3. CheckNo&#34; ShowHeader=&#34;false&#34; HeaderStyle-Wrap=&#34;false&#34; SortExpression=&#34;CheckNo&#34; /&gt; &lt;asp:TemplateField HeaderText=&#34;4. Check Memo&#34; SortExpression=&#34;CheckMemo&#34;&gt; &lt;ItemTemplate&gt; &lt;asp:Label ID=&#34;LabelCheckMemo&#34; runat=&#34;server&#34; Text=&#39;&lt;%# Eval(&#34;CheckMemo&#34;) %&gt;&#39; Visible=&#34;false&#34;&gt;&lt;/asp:Label&gt; &lt;asp:TextBox ID=&#34;TextCheckMemo&#34; runat=&#34;server&#34; Text=&#39;&lt;%# Eval(&#34;CheckMemo&#34;) %&gt;&#39; Visible=&#34;false&#34; CssClass=&#34;form-control UpdateLoan&#34; MaxLength=&#34;30&#34;&gt;&lt;/asp:TextBox&gt; &lt;/ItemTemplate&gt; &lt;HeaderStyle Wrap=&#34;False&#34; /&gt; &lt;/asp:TemplateField&gt; &lt;asp:BoundField DataField=&#34;LoanCode&#34; HeaderText=&#34;5. Loan Code&#34; ShowHeader=&#34;false&#34; HeaderStyle-Wrap=&#34;false&#34; SortExpression=&#34;LoanCode&#34; /&gt; &lt;asp:TemplateField HeaderText=&#34;6. GL Account&#34; HeaderStyle-HorizontalAlign=&#34;Left&#34; SortExpression=&#34;GLAcct&#34;&gt; &lt;ItemTemplate&gt; &lt;asp:Label ID=&#34;LabelGLAcct&#34; runat=&#34;server&#34; Text=&#39;&lt;%# Eval(&#34;GLAcct&#34;) %&gt;&#39;&gt;&lt;/asp:Label&gt; &lt;asp:DropDownList ID=&#34;DropdownlistGLAcct&#34; runat=&#34;server&#34; Visible=&#34;false&#34; CssClass=&#34;form-control UpdateLoan&#34; /&gt; &lt;/ItemTemplate&gt; &lt;HeaderStyle HorizontalAlign=&#34;Left&#34; Wrap=&#34;false&#34; /&gt; &lt;/asp:TemplateField&gt; &lt;asp:TemplateField HeaderText=&#34;7. Amount&#34; HeaderStyle-HorizontalAlign=&#34;Right&#34; SortExpression=&#34;Amount&#34;&gt; &lt;ItemTemplate&gt; &lt;asp:Label ID=&#34;LabelAmount&#34; runat=&#34;server&#34; Text=&#39;&lt;%# String.Format(&#34;$ {0:#,##0.00}&#34;, Eval(&#34;Amount&#34;)) %&gt;&#39;&gt;&lt;/asp:Label&gt; &lt;asp:TextBox ID=&#34;TextAmount&#34; runat=&#34;server&#34; Text=&#39;&lt;%# Eval(&#34;Amount&#34;) %&gt;&#39; Style=&#34;text-align: right&#34; ReadOnly=&#34;true&#34; CssClass=&#34;currencyMask form-control UpdateLoan&#34;&gt;&lt;/asp:TextBox&gt; &lt;/ItemTemplate&gt; &lt;FooterTemplate&gt; &lt;asp:Label ID=&#34;lblTotal&#34; runat=&#34;server&#34; CssClass=&#34;sum&#34;&gt;&lt;/asp:Label&gt; &lt;/FooterTemplate&gt; &lt;/asp:TemplateField&gt; &lt;/Columns&gt; &lt;/asp:GridView&gt; &lt;/div&gt;</pre> <p><span style="text-decoration: underline;"><strong>Namespaces</strong></span></p> <p><strong>C#</strong></p> <pre class="brush: csharp">using System.Data;</pre> <p><strong>VB.Net</strong></p> <pre class="brush: vb">Imports System.Data </pre> <p><span style="text-decoration: underline;"><strong>Code</strong></span></p> <p><strong>C#</strong></p> <pre class="brush: csharp">protected void Page_Load(object sender, EventArgs e) { if (!this.IsPostBack) { DataTable dt = new DataTable(); dt.Columns.AddRange(new DataColumn[] { new DataColumn(&#34;ID&#34;, typeof(int)), new DataColumn(&#34;CheckDate&#34;, typeof(string)), new DataColumn(&#34;BorrowerName&#34;, typeof(string)), new DataColumn(&#34;CheckNo&#34;, typeof(string)), new DataColumn(&#34;CheckMemo&#34;, typeof(string)), new DataColumn(&#34;LoanCode&#34;, typeof(int)), new DataColumn(&#34;GLAcct&#34;, typeof(string)), new DataColumn(&#34;Amount&#34;, typeof(int))}); dt.Rows.Add(1, &#34;01/02/2018&#34;, &#34;BN&#34;, &#34;123455AAA&#34;, &#34;CM&#34;, 124, &#34;GA&#34;, 100); dt.Rows.Add(2, &#34;02/02/2018&#34;, &#34;BN1&#34;, &#34;123455AAA112&#34;, &#34;CM1&#34;, 12411, &#34;GA1&#34;, 200); gvtfaLoan.DataSource = dt; gvtfaLoan.DataBind(); gvtfaLoan.FooterRow.Cells[6].Text = &#34;Grand Total&#34;; gvtfaLoan.FooterRow.Cells[6].Font.Bold = true; } }</pre> <p><strong>VB.Net</strong></p> <pre class="brush: vb">Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load If Not Me.IsPostBack Then Dim dt As DataTable = New DataTable() dt.Columns.AddRange(New DataColumn() {New DataColumn(&#34;ID&#34;, GetType(Integer)), New DataColumn(&#34;CheckDate&#34;, GetType(String)), New DataColumn(&#34;BorrowerName&#34;, GetType(String)), New DataColumn(&#34;CheckNo&#34;, GetType(String)), New DataColumn(&#34;CheckMemo&#34;, GetType(String)), New DataColumn(&#34;LoanCode&#34;, GetType(Integer)), New DataColumn(&#34;GLAcct&#34;, GetType(String)), New DataColumn(&#34;Amount&#34;, GetType(Integer))}) dt.Rows.Add(1, &#34;01/02/2018&#34;, &#34;BN&#34;, &#34;123455AAA&#34;, &#34;CM&#34;, 124, &#34;GA&#34;, 100) dt.Rows.Add(2, &#34;02/02/2018&#34;, &#34;BN1&#34;, &#34;123455AAA112&#34;, &#34;CM1&#34;, 12411, &#34;GA1&#34;, 200) gvtfaLoan.DataSource = dt gvtfaLoan.DataBind() gvtfaLoan.FooterRow.Cells(6).Text = &#34;Grand Total&#34; gvtfaLoan.FooterRow.Cells(6).Font.Bold = True End If End Sub</pre> <p><span style="text-decoration: underline;"><strong>Screenshot</strong></span></p> <p><img src="https://imgur.com/32ROPbx.jpg" alt="" width="472" height="162" /></p>https://www.aspforums.net:443/Threads/149880/Display-ASPNet-GridView-row-total-in-Footer-using-jQuery/https://www.aspforums.net:443/Threads/149880/Display-ASPNet-GridView-row-total-in-Footer-using-jQuery/Mon, 24 Dec 2018 02:45:03 GMTDisplay ASP.Net GridView row total in Footer using jQuery<p>I was able to resolve my issue with the following javascript:</p> <p>(I needed to dynamically update the total on the fly as well as have the total calculated when the second nested gridview was opened)</p> <pre class="brush: js"> &lt;script type=&#34;text/javascript&#34;&gt; $(function () { var grandTotal = 0; $(&#39;#gvtfaLoan&#39;).find(&#39;tr:has(td)&#39;).each(function (i) { if (i &lt; $(&#39;[id$=gvtfaLoan]&#39;).find(&#39;tr:has(td)&#39;).length - 1) { grandTotal += parseFloat($(this).find(&#39;[id*=TextAmount]&#39;).val()); } }); //$(&#34;[id*=txtDelete]&#34;).html(&#34;$&#34; + grandTotal.toFixed(2)); $(&#34;[id*=txtTotal]&#34;).html(&#34;$&#34; + grandTotal.toFixed(2)); }); $(function () { $(&#34;body&#34;).on(&#34;change keyup&#34;, &#34;[id*=TextAmount]&#34;, function () { var grandTotal = 0; $(&#39;#gvtfaLoan&#39;).find(&#39;tr:has(td)&#39;).each(function (i) { if (i &lt; $(&#39;[id$=gvtfaLoan]&#39;).find(&#39;tr:has(td)&#39;).length - 1) { grandTotal += parseFloat($(this).find(&#39;[id*=TextAmount]&#39;).val()); } }); $(&#34;[id*=txtTotal]&#34;).html(&#34;$&#34; + grandTotal.toFixed(2)); }); }); &lt;/script&gt;</pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/149880/Display-ASPNet-GridView-row-total-in-Footer-using-jQuery/https://www.aspforums.net:443/Threads/149880/Display-ASPNet-GridView-row-total-in-Footer-using-jQuery/Tue, 25 Dec 2018 00:02:59 GMT