[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 4205
  • Last Modified:

how to loop through gridview rows using jquery after checkbox click

I have a gridview within an update panel that I need to have calculated anytime someone clicks on or clicks off a checkbox that is one of the gridview columns.  The gridview also contains a column with a $ amount.  When someone clicks off the checkbox I then need to go through the rows and calculate those rows that still have the checkbox checked.   I would like to do this in a jquery script.  Any help will be greatly appreciated.

Here is the code.

<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
		
		<Triggers>
			<asp:AsyncPostBackTrigger ControlID="btngrid" EventName="Click" />
			<%--<asp:AsyncPostBackTrigger ControlID="AsyncFileUpload1" EventName="UploadedComplete" />--%>
		</Triggers>
		<ContentTemplate>
			
		
			<table style="width:100%">
			<tr>
			<td>
				<asp:Label ID="lblFileName" runat="server"></asp:Label></td>
				<td style="text-align:right">
				<asp:Label runat="server" Text="eSite Posting Date:" Font-Bold="True"></asp:Label>
				&nbsp;
				<asp:TextBox runat="server" ID="txtDate"></asp:TextBox>
					<asp:CalendarExtender ID="txtDate_CalendarExtender" runat="server" Enabled="True" TargetControlID="txtDate">
					</asp:CalendarExtender>
					
				</td></tr>
				<tr>
					<td>
					
						<asp:CheckBox ID="ChkAll" runat="server" AutoPostBack="True" Text="Select All" />
					
					</td>
					<td style="text-align: right">
						<asp:Label ID="Label19" runat="server" Font-Bold="True" Text="Enter Deposit Total:"></asp:Label>
						&nbsp;<asp:TextBox ID="TxtControlTotal" runat="server"></asp:TextBox>
					</td>
				</tr>
				
			</table>
			
			&nbsp;&nbsp;
			
			<br />
			<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="LightGoldenrodYellow" BorderColor="Tan" BorderWidth="1px" CellPadding="2" ForeColor="Black"
				GridLines="None"  Font-Size="X-Small" HorizontalAlign="Left" DataKeyNames="ID" EmptyDataText="No Items found" ShowFooter="True">
				<Columns>
					<asp:TemplateField  >
						<ItemTemplate>
							<asp:ImageButton ID="btnID2" runat="server" CommandArgument='<%# Bind("ID") %>' CommandName="Select" Text="Change" ImageUrl="../images/link.png"> </asp:imageButton>
						</ItemTemplate>
					</asp:TemplateField>
					<asp:TemplateField HeaderText="Begin Date" >
						<EditItemTemplate>
							<asp:TextBox ID="TextBox2" runat="server" Text='<%# Eval("BeginDate", "{0:d}") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="Label2" runat="server" Text='<%# Bind("BeginDate", "{0:d}") %>'></asp:Label>
						</ItemTemplate>
						
						<HeaderStyle HorizontalAlign="Left" />
						<ItemStyle Width="65px" />
						
					</asp:TemplateField>
					<asp:TemplateField HeaderText="End Date" >
						<EditItemTemplate>
							<asp:TextBox ID="TextBox3" runat="server" Text='<%# Eval("BeginDate", "{0:d}") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="Label3" runat="server" Text='<%# Bind("BeginDate", "{0:d}") %>'></asp:Label>
						</ItemTemplate>
						
						<HeaderStyle HorizontalAlign="Left" />
						<ItemStyle HorizontalAlign="Left" Width="65px" />
						
					</asp:TemplateField>
					<asp:TemplateField HeaderText="Location" >
						<EditItemTemplate>
							<asp:TextBox ID="TextBox4" runat="server" Text='<%# Bind("LocationName") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="Label4" runat="server" Text='<%# Bind("LocationName") %>'></asp:Label>
						</ItemTemplate>
						
						<HeaderStyle HorizontalAlign="Left" />
						<ItemStyle HorizontalAlign="Left" Width="100px" />
						
					</asp:TemplateField>
					<asp:TemplateField HeaderText="Deposit Acct">
						<EditItemTemplate>
							<asp:TextBox ID="txtDepositAcct" runat="server" Text='<%# Bind("DepositAcct") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="lblDepositAcct" runat="server" Text='<%# Bind("DepositAcct") %>'></asp:Label>
						</ItemTemplate>
						<HeaderStyle HorizontalAlign="Left" />
						<ItemStyle Width="70px" />
					</asp:TemplateField>
					<asp:TemplateField HeaderText="Submit Date" Visible="False" >
						<EditItemTemplate>
							<asp:TextBox ID="TextBox6" runat="server" Text='<%# Eval("SubmitDate", "{0:d}") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="Label6" runat="server" Text='<%# Bind("SubmitDate", "{0:d}") %>'></asp:Label>
						</ItemTemplate>
						
					</asp:TemplateField>
					<asp:TemplateField HeaderText="Post Date" >
						<EditItemTemplate>
							<asp:TextBox ID="TextBox7" runat="server" Text='<%# Eval("PostDate", "{0:d}") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="Label7" runat="server" Text='<%# Bind("PostDate", "{0:d}") %>'></asp:Label>
						</ItemTemplate>
						
					</asp:TemplateField>
					
					<asp:TemplateField HeaderText="Deposit No." ControlStyle-Width="60px">
						<EditItemTemplate>
							<asp:TextBox ID="txtDepositNum" runat="server" Text='<%# Bind("DepositNum") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="lblDepositNum" text-align="center" runat="server" Text='<%# Bind("DepositNum") %>' ></asp:Label>
						</ItemTemplate>
						<HeaderStyle HorizontalAlign="Center" />
						<ItemStyle HorizontalAlign="Center" />
						<ControlStyle Width="60px" />
						
						
					</asp:TemplateField>
					<asp:TemplateField HeaderText="Type">
						<EditItemTemplate>
							<asp:TextBox ID="TextBox9" runat="server" Text='<%# Bind("ItemType") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="Label9" runat="server" Text='<%# Bind("ItemType") %>'></asp:Label>
						</ItemTemplate>
						<HeaderStyle HorizontalAlign="left" />
					</asp:TemplateField>
					<asp:TemplateField HeaderText="User Name" ControlStyle-Width="60">
						<EditItemTemplate>
							<asp:TextBox ID="TextBox11" runat="server" Text='<%# Bind("UserName") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="Label11" runat="server" Text='<%# Bind("UserName") %>' ></asp:Label>
						</ItemTemplate>
						<ControlStyle Width="60px" />
						<HeaderStyle HorizontalAlign="Left" />
					</asp:TemplateField>
					
					<asp:TemplateField HeaderText="Route No. / Acct No." ControlStyle-Width="50px">
						<EditItemTemplate>
							<asp:TextBox ID="TextBox12" runat="server" Text='<%# Eval("RouteNo") + "/" %> '></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="Label12" runat="server" Text='<%# Eval("RouteNo") %>'></asp:Label>
							<asp:Label ID="Label13" runat="server" Text='<%# Eval("AcctNo" ) %>'></asp:Label>
						</ItemTemplate>
						
						<ControlStyle Width="65px" />
						
						<HeaderStyle HorizontalAlign="Left" />
						<ItemStyle HorizontalAlign="Left" ForeColor="Blue" />
						
					</asp:TemplateField>
					<asp:TemplateField HeaderText="Post Amt.">
						<EditItemTemplate>
							<asp:TextBox ID="txtPostAmt" runat="server" Text='<%# Bind("PostAmt","{0:c}") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="lblPostAmt" runat="server" Text='<%# Bind("PostAmt","{0:c}") %>'></asp:Label>
						</ItemTemplate>
						<ItemStyle HorizontalAlign="Right" ForeColor="Red" />
						<HeaderStyle HorizontalAlign="Center" />
					</asp:TemplateField>
					<asp:TemplateField HeaderText="Check No.">
						<EditItemTemplate>
							<asp:TextBox ID="TextBox15" runat="server" Text='<%# Bind("CheckNo") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="Label15" runat="server" Text='<%# Bind("CheckNo") %>'></asp:Label>
						</ItemTemplate>
						<ItemStyle HorizontalAlign="Center" />
					</asp:TemplateField>
					<asp:TemplateField HeaderText="eSite ID">
						<EditItemTemplate>
							<asp:TextBox ID="txteSiteID" runat="server" Text='<%# Bind("eSiteID") %>'></asp:TextBox>
						</EditItemTemplate>
						<ItemTemplate>
							<asp:Label ID="lbleSiteID" runat="server" Text='<%# Bind("eSiteID") %>'></asp:Label>
						</ItemTemplate>
						<ItemStyle Wrap="false" />
					</asp:TemplateField>
					
					<asp:TemplateField HeaderText="C">
						<ItemTemplate>
							<asp:ImageButton ID="ImageButton1" runat="server" CausesValidation="false" readonly = "true" CommandName="Confirmed" CommandArgument='<%# Bind("IsConfirmed") %>' />
						</ItemTemplate>
						<ItemStyle Width="50px" HorizontalAlign="Center" />
					</asp:TemplateField>
									
										
					<asp:TemplateField HeaderText="M">
						<EditItemTemplate>
							<asp:CheckBox ID="CheckBox1" runat="server" Checked='<%# Bind("isMatched") %>' AutoPostBack="true"    />
						</EditItemTemplate>
						<ItemTemplate>
							<asp:CheckBox ID="CheckBox1" runat="server" Checked='<%# Bind("isMatched") %>' AutoPostBack="true"  />
						</ItemTemplate>
						<FooterTemplate>
							<asp:Label ID="Label20" runat="server" Text="Totals"></asp:Label>
						</FooterTemplate>
					</asp:TemplateField>
									
					
					<asp:BoundField DataField="ResiName" HeaderText="Name" ReadOnly="True" Visible="True" />
					
					<asp:TemplateField HeaderText="Bldg/Unit">
						<ItemTemplate>
							<asp:Label runat="server" ID="label17" Enabled="false" Visible="True" Text='<%# Eval("BldgID") + "-" + Eval("UnitID") %>'></asp:Label>
						</ItemTemplate>
						<FooterTemplate>
							<asp:Label ID="txtSumAmt" runat="server" Width="75px"></asp:Label>
						</FooterTemplate>
					</asp:TemplateField>
						
					<asp:BoundField DataField="PCount" HeaderText="PCount" ReadOnly="True" Visible="False" />
					<asp:TemplateField HeaderText="P">
						<ItemTemplate>
							<asp:CheckBox ID="CheckBox2" runat="server" Checked='<%# Bind("Collection") %>' />
						</ItemTemplate>
						<EditItemTemplate>
							<asp:CheckBox ID="CheckBox2" runat="server" Checked='<%# Bind("Collection") %>' />
						</EditItemTemplate>
					</asp:TemplateField>
				</Columns>
				<FooterStyle BackColor="Tan" />
				<PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue" HorizontalAlign="Center" />
				<SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" />
				<HeaderStyle BackColor="Tan" Font-Bold="True" HorizontalAlign="Left" />
				<EditRowStyle Font-Bold="True" />
				<AlternatingRowStyle BackColor="PaleGoldenrod" />
			</asp:GridView>
			<p>
				&nbsp; &nbsp;
			</p>
			<br />
			<div>
				<asp:HiddenField ID="HFTotals" runat="server" Value ="0" />
			</div>
			<div style="width:100%; text-align:center;">
				<asp:Button runat="server" ID="btnPost" Text="Post Entries" Enabled ="false" />
			</div>
		</ContentTemplate>
	</asp:UpdatePanel>

Open in new window

0
mgmhicks
Asked:
mgmhicks
  • 4
  • 4
  • 2
1 Solution
 
Alexandre SimõesManager / Technology SpecialistCommented:
Whenever you want to change server-side generated code with javascript you need to forget about the server-side code and look at what actually was rendered in the browser.
Open the page and view source code or better yet, use firebug or any other developer tools to visually inspect the DOM.

Ok, this said, I can tell you you'll find a <table> block where you have your grid view.

Loop through all the rows checking the value of the chackbox and keep adding the value in the value column to a variable (be aware of numeric formats).

To help you further I need the generated table markup, not the ASP.net gridview definition.
0
 
mgmhicksAuthor Commented:
Here is the rendered code for a row in the gridview1.  The ID of the checkbox that gets checked Is checkbox1 the id of the column that needs to be summed is PostAmt.  Let me know if you need more, and thank you for the help.



<table id="ctl00_ContentPlaceHolder1_GridView1" cellspacing="0" cellpadding="2" border="0" align="Left" style="color:Black;background-color:LightGoldenrodYellow;border-color:Tan;border-width:1px;border-style:solid;font-size:X-Small;border-collapse:collapse;">
<tbody>
<tr align="left" style="background-color:Tan;font-weight:bold;">
<tr>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl02_btnID2" type="image" style="border-width:0px;" src="../images/link.png" text="Change" name="ctl00$ContentPlaceHolder1$GridView1$ctl02$btnID2">
</td>
<td style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label2">10/14/2013</span>
</td>
<td align="left" style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label3">10/14/2013</span>
</td>
<td align="left" style="width:100px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label4">Cool Creek</span>
</td>
<td style="width:70px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_lblDepositAcct">985002771</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label7">10/14/2013</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_lblDepositNum" style="display:inline-block;width:60px;" text-align="center">38257</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label9">Personal Check</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label11" style="display:inline-block;width:60px;">Kimberly Stojak</span>
</td>
<td align="left" style="color:Blue;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label12" style="display:inline-block;width:65px;">8002</span>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label13" style="display:inline-block;width:65px;">20878721447</span>
</td>
<td align="right" style="color:Red;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_lblPostAmt">$20.00</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label15"></span>
</td>
<td style="white-space:nowrap;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_lbleSiteID">CM-155 </span>
</td>
<td align="center" style="width:50px;">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl02_ImageButton1" type="image" style="border-width:0px;" src="../images/X3.png" readonly="true" name="ctl00$ContentPlaceHolder1$GridView1$ctl02$ImageButton1">
</td>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl02_CheckBox1" type="checkbox" onclick="javascript:setTimeout('__doPostBack(\'ctl00$ContentPlaceHolder1$GridView1$ctl02$CheckBox1\',\'\')', 0)" name="ctl00$ContentPlaceHolder1$GridView1$ctl02$CheckBox1">
</td>
<td> </td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_label17" disabled="disabled">-</span>
</td>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl02_CheckBox2" type="checkbox" name="ctl00$ContentPlaceHolder1$GridView1$ctl02$CheckBox2">
</td>
</tr>

Open in new window

0
 
Alexandre SimõesManager / Technology SpecialistCommented:
I wrote this but didn't test it:
var total = 0;
$.each('table[id$="_GridView1"] tbody tr', function(idx,item){
    var $item = $(item);
    var chk = $item.find('input[type="checkbox"][id$="_CheckBox1"]');
    var value = parseFloat($item.find('span[id$="_lblPostAmt"]').html().replace(/\$/,""));
    
    if(chk.val()){
        total = total + value;
    }
});

alert(total);

Open in new window

It shouldn't be far from the truth... :)

I wrote it here http://jsfiddle.net/y8g9u/ but it doesn't quite run well and I'm a bit short on time now, sorry.
Have a try and tell me how it went
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
mgmhicksAuthor Commented:
I changed things a little but when I click on the checkbox nothing happens.  Also update jsfiddle file.  Any ideas.

<script type="text/javascript">
		$(function() {
			var total = 0;
			var checked = $('input:checkbox').click(function(e) {
				calculateSum();
			});

		});

		function calculateSum() {

			$checked.each('table[id$="_GridView1"] tbody tr', function(idx, item) {
				var $item = $(item);
				var chk = $item.find('input[type="checkbox"][id$="_CheckBox1"]');
				var value = parseFloat($item.find('span[id$="_lblPostAmt"]').html().replace(/\$/, ""));

				if (chk.val())
				{ total = total + value; }
			});

			alert(total);


		}
	
	</script>

Open in new window

0
 
ArkCommented:
$(function(){
    $('table[id$="_GridView1"] tbody tr')
    .find(':checkbox[id*=CheckBox1]')
    .click(function(){alert(calculateSum());});
});

function calculateSum(){
    var total = 0;
    $('table[id$="_GridView1"] tbody tr')
    .has(':checkbox[id*=CheckBox1]:checked')
    .each(function(){
        total += parseFloat(
            $(this).find('span[id$="_lblPostAmt"]')
            .html().replace(/\$/, ""));
    });
    return total;
}

Open in new window

BTW I suggest you to use classes (for table and checkboxes) to easy find elements with jquery
0
 
mgmhicksAuthor Commented:
When I click the checkbox the function is still not firing.
0
 
Alexandre SimõesManager / Technology SpecialistCommented:
The markup of the table you posted above is not complete...
Can you give me the full table? Put it in a file.
I need the full GridView1 table from <table> to </table>
0
 
mgmhicksAuthor Commented:
<table id="ctl00_ContentPlaceHolder1_GridView1" cellspacing="0" cellpadding="2" border="0" align="Left" style="color:Black;background-color:LightGoldenrodYellow;border-color:Tan;border-width:1px;border-style:solid;font-size:X-Small;border-collapse:collapse;">
<tbody>
<tr align="left" style="background-color:Tan;font-weight:bold;">
<th scope="col"> </th>
<th align="left" scope="col">Begin Date</th>
<th align="left" scope="col">End Date</th>
<th align="left" scope="col">Location</th>
<th align="left" scope="col">Deposit Acct</th>
<th scope="col">Post Date</th>
<th align="center" scope="col">Deposit No.</th>
<th align="left" scope="col">Type</th>
<th align="left" scope="col">User Name</th>
<th align="left" scope="col">Route No. / Acct No.</th>
<th align="center" scope="col">Post Amt.</th>
<th scope="col">Check No.</th>
<th scope="col">eSite ID</th>
<th scope="col">C</th>
<th scope="col">M</th>
<th scope="col">Name</th>
<th scope="col">Bldg/Unit</th>
<th scope="col">P</th>
</tr>
<tr>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl02_btnID2" type="image" style="border-width:0px;" src="../images/link.png" text="Change" name="ctl00$ContentPlaceHolder1$GridView1$ctl02$btnID2">
</td>
<td style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label2">10/14/2013</span>
</td>
<td align="left" style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label3">10/14/2013</span>
</td>
<td align="left" style="width:100px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label4">Cool Creek</span>
</td>
<td style="width:70px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_lblDepositAcct">985002771</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label7">10/14/2013</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_lblDepositNum" style="display:inline-block;width:60px;" text-align="center">38257</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label9">Personal Check</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label11" style="display:inline-block;width:60px;">Kimberly Stojak</span>
</td>
<td align="left" style="color:Blue;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label12" style="display:inline-block;width:65px;">8002</span>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label13" style="display:inline-block;width:65px;">20878721447</span>
</td>
<td align="right" style="color:Red;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_lblPostAmt">$20.00</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_Label15"></span>
</td>
<td style="white-space:nowrap;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_lbleSiteID">CM-155 </span>
</td>
<td align="center" style="width:50px;">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl02_ImageButton1" type="image" style="border-width:0px;" src="../images/X3.png" readonly="true" name="ctl00$ContentPlaceHolder1$GridView1$ctl02$ImageButton1">
</td>
<td>
<span disabled="disabled">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl02_CheckBox1" type="checkbox" disabled="disabled" name="ctl00$ContentPlaceHolder1$GridView1$ctl02$CheckBox1">
</span>
</td>
<td> </td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl02_label17" disabled="disabled">-</span>
</td>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl02_CheckBox2" type="checkbox" name="ctl00$ContentPlaceHolder1$GridView1$ctl02$CheckBox2">
</td>
</tr>
<tr style="background-color:PaleGoldenrod;">
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl03_btnID2" type="image" style="border-width:0px;" src="../images/link.png" text="Change" name="ctl00$ContentPlaceHolder1$GridView1$ctl03$btnID2">
</td>
<td style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_Label2">10/14/2013</span>
</td>
<td align="left" style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_Label3">10/14/2013</span>
</td>
<td align="left" style="width:100px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_Label4">Cool Creek</span>
</td>
<td style="width:70px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_lblDepositAcct">985002771</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_Label7">10/14/2013</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_lblDepositNum" style="display:inline-block;width:60px;" text-align="center">38257</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_Label9">Personal Check</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_Label11" style="display:inline-block;width:60px;">Kimberly Stojak</span>
</td>
<td align="left" style="color:Blue;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_Label12" style="display:inline-block;width:65px;">8002</span>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_Label13" style="display:inline-block;width:65px;">20878721436</span>
</td>
<td align="right" style="color:Red;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_lblPostAmt">$1,000.00</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_Label15"></span>
</td>
<td style="white-space:nowrap;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_lbleSiteID"> </span>
</td>
<td align="center" style="width:50px;">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl03_ImageButton1" type="image" style="border-width:0px;" src="../images/X3.png" readonly="true" name="ctl00$ContentPlaceHolder1$GridView1$ctl03$ImageButton1">
</td>
<td>
<span disabled="disabled">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl03_CheckBox1" type="checkbox" disabled="disabled" name="ctl00$ContentPlaceHolder1$GridView1$ctl03$CheckBox1">
</span>
</td>
<td> </td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl03_label17" disabled="disabled">-</span>
</td>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl03_CheckBox2" type="checkbox" name="ctl00$ContentPlaceHolder1$GridView1$ctl03$CheckBox2">
</td>
</tr>
<tr>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl04_btnID2" type="image" style="border-width:0px;" src="../images/link.png" text="Change" name="ctl00$ContentPlaceHolder1$GridView1$ctl04$btnID2">
</td>
<td style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_Label2">10/14/2013</span>
</td>
<td align="left" style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_Label3">10/14/2013</span>
</td>
<td align="left" style="width:100px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_Label4">Cool Creek</span>
</td>
<td style="width:70px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_lblDepositAcct">985002771</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_Label7">10/14/2013</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_lblDepositNum" style="display:inline-block;width:60px;" text-align="center">38257</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_Label9">Personal Check</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_Label11" style="display:inline-block;width:60px;">Kimberly Stojak</span>
</td>
<td align="left" style="color:Blue;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_Label12" style="display:inline-block;width:65px;">031301846</span>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_Label13" style="display:inline-block;width:65px;">538353947</span>
</td>
<td align="right" style="color:Red;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_lblPostAmt">$73.40</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_Label15">478</span>
</td>
<td style="white-space:nowrap;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_lbleSiteID">CM-121 </span>
</td>
<td align="center" style="width:50px;">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl04_ImageButton1" type="image" style="border-width:0px;" src="../images/X3.png" readonly="true" name="ctl00$ContentPlaceHolder1$GridView1$ctl04$ImageButton1">
</td>
<td>
<span disabled="disabled">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl04_CheckBox1" type="checkbox" disabled="disabled" name="ctl00$ContentPlaceHolder1$GridView1$ctl04$CheckBox1">
</span>
</td>
<td> </td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl04_label17" disabled="disabled">-</span>
</td>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl04_CheckBox2" type="checkbox" name="ctl00$ContentPlaceHolder1$GridView1$ctl04$CheckBox2">
</td>
</tr>
<tr style="background-color:PaleGoldenrod;">
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl05_btnID2" type="image" style="border-width:0px;" src="../images/link.png" text="Change" name="ctl00$ContentPlaceHolder1$GridView1$ctl05$btnID2">
</td>
<td style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_Label2">10/14/2013</span>
</td>
<td align="left" style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_Label3">10/14/2013</span>
</td>
<td align="left" style="width:100px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_Label4">Cool Creek</span>
</td>
<td style="width:70px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_lblDepositAcct">985002771</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_Label7">10/14/2013</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_lblDepositNum" style="display:inline-block;width:60px;" text-align="center">38257</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_Label9">Personal Check</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_Label11" style="display:inline-block;width:60px;">Kimberly Stojak</span>
</td>
<td align="left" style="color:Blue;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_Label12" style="display:inline-block;width:65px;">031302955</span>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_Label13" style="display:inline-block;width:65px;">950793681</span>
</td>
<td align="right" style="color:Red;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_lblPostAmt">$90.40</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_Label15">2662</span>
</td>
<td style="white-space:nowrap;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_lbleSiteID">CM-112 </span>
</td>
<td align="center" style="width:50px;">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl05_ImageButton1" type="image" style="border-width:0px;" src="../images/check2x.png" readonly="true" name="ctl00$ContentPlaceHolder1$GridView1$ctl05$ImageButton1">
</td>
<td>
<span disabled="disabled">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl05_CheckBox1" type="checkbox" disabled="disabled" checked="checked" name="ctl00$ContentPlaceHolder1$GridView1$ctl05$CheckBox1">
</span>
</td>
<td>FRED J. WILLIAMS</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl05_label17" disabled="disabled">CM-112</span>
</td>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl05_CheckBox2" type="checkbox" name="ctl00$ContentPlaceHolder1$GridView1$ctl05$CheckBox2">
</td>
</tr>
<tr>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl06_btnID2" type="image" style="border-width:0px;" src="../images/link.png" text="Change" name="ctl00$ContentPlaceHolder1$GridView1$ctl06$btnID2">
</td>
<td style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_Label2">10/14/2013</span>
</td>
<td align="left" style="width:65px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_Label3">10/14/2013</span>
</td>
<td align="left" style="width:100px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_Label4">Cool Creek</span>
</td>
<td style="width:70px;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_lblDepositAcct">985002771</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_Label7">10/14/2013</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_lblDepositNum" style="display:inline-block;width:60px;" text-align="center">38257</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_Label9">Personal Check</span>
</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_Label11" style="display:inline-block;width:60px;">Kimberly Stojak</span>
</td>
<td align="left" style="color:Blue;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_Label12" style="display:inline-block;width:65px;">031312738</span>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_Label13" style="display:inline-block;width:65px;">5111123305</span>
</td>
<td align="right" style="color:Red;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_lblPostAmt">$64.90</span>
</td>
<td align="center">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_Label15">1207</span>
</td>
<td style="white-space:nowrap;">
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_lbleSiteID">CM-040 </span>
</td>
<td align="center" style="width:50px;">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl06_ImageButton1" type="image" style="border-width:0px;" src="../images/check2x.png" readonly="true" name="ctl00$ContentPlaceHolder1$GridView1$ctl06$ImageButton1">
</td>
<td>
<span disabled="disabled">
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl06_CheckBox1" type="checkbox" disabled="disabled" checked="checked" name="ctl00$ContentPlaceHolder1$GridView1$ctl06$CheckBox1">
</span>
</td>
<td>Kelly S. Grube</td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl06_label17" disabled="disabled">CM-040</span>
</td>
<td>
<input id="ctl00_ContentPlaceHolder1_GridView1_ctl06_CheckBox2" type="checkbox" name="ctl00$ContentPlaceHolder1$GridView1$ctl06$CheckBox2">
</td>
</tr>
<tr style="background-color:Tan;">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl07_Label20">Totals</span>
</td>
<td> </td>
<td>
<span id="ctl00_ContentPlaceHolder1_GridView1_ctl07_txtSumAmt" style="display:inline-block;width:75px;">$155.30</span>
</td>
<td> </td>
</tr>
</tbody>
</table>

Open in new window

0
 
Alexandre SimõesManager / Technology SpecialistCommented:
Ok, like that was easier :)
http://jsfiddle.net/y8g9u/7/
var total = 0;

$('table[id$="_GridView1"] tr').each(function(idx, item){
    var $item = $(item);
    var chk = $item.find('input[type="checkbox"][id$="_CheckBox1"]:checked');
    var value = $item.find('span[id$="_lblPostAmt"]').html();
    if(value) value = parseFloat(value.replace(/[\$,]/g,""));

    if(chk && chk.length && value){
        total = total + value;
    }
});

alert(total);

Open in new window

0
 
ArkCommented:
For some reason you checkboxes#1 was disabled so I enabled them on page load.
see attached html examplechkTest.html
    <script type="text/javascript">
$(function(){
var boxes=$('table[id$="_GridView1"] tbody tr').find(':checkbox[id*=CheckBox1]');
boxes.prop('disabled',false); //enable checkboxes
var spanTotal=$("span[id$=_txtSumAmt]");
boxes.click(function(){
        var sum=calculateSum().toFixed(2).replace(/(^\d{1,3}|\d{3})(?=(?:\d{3})+(?:$|\.))/g, '$1,');
        spanTotal.text('$' + sum);
    });	
});

function calculateSum(){
    var total = 0;
    $('table[id$="_GridView1"] tbody tr')
    .has(':checkbox[id*=CheckBox1]:checked')
    .each(function(){
        total += parseFloat(
            $(this).find('span[id$="_lblPostAmt"]').html().replace(/[\$,]/g,""));
    });
    return total;
}

Open in new window

0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 4
  • 4
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now