By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
446,367 Members | 1,329 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 446,367 IT Pros & Developers. It's quick & easy.

Javascript calculating total in gridview

parshupooja
100+
P: 159
Hi
I am using asp.net C# and javascript.
I have a gridview with 5 columns and 14 row
column1--column2--column3--column4--column5

Column1 to column4 is textboxes wheresa column5 is label
I am trying to calculate column 5 which is (column2-column1)+(column4-column3)
Here is javascript i am using. When i use this it just calculates for first row of gridview.
Expand|Select|Wrap|Line Numbers
  1. <script language =javascript type="text/javascript">
  2.                        function Total()
  3.                                {
  4.  
  5.                                 var int1=parseInt(document.getElementById("ctl00_contentPlaceHolder_GridView1_ctl02_TextBox1").value);
  6.                                 var int2 = parseInt(document.getElementById("ctl00_contentPlaceHolder_GridView1_ctl02_TextBox2").value);
  7.                                 var int3 = parseInt(document.getElementById("ctl00_contentPlaceHolder_GridView1_ctl02_TextBox3").value);
  8.                                 var int4 = parseInt(document.getElementById("ctl00_contentPlaceHolder_GridView1_ctl02_TextBox4").value);
  9.                                 var int5 = (int2-int1+int4-int3);
  10.                                 document.getElementById("ctl00_contentPlaceHolder_GridView1_ctl02_lblTotalHr").innerText = int5;
  11.  }
  12. </script>
  13.  
i have tried using document.getElementById("<%=TextBox1.ClientID%>") and

document.getElementById("<%=GridView1.TextBox1.Cli entID%>") but throws error

plz help
Sep 20 '07 #1
Share this Question
Share on Google+
9 Replies


gits
Expert Mod 5K+
P: 5,384
hi ...

as far as can see your script is doing what you want from it :) ... in case you have 14 rows you have to loop through you rows and call the function for every row you have ... and then you have to add all row-totals?

kind regards
Sep 20 '07 #2

parshupooja
100+
P: 159
your are right i need to loop thr it,but since only bolded part is changing for each control, i don't know how to do it. could show me little snippet or refer meto the article

ctl00_contentPlaceHolder_GridView1_ctl02_TextBox1
hi ...

as far as can see your script is doing what you want from it :) ... in case you have 14 rows you have to loop through you rows and call the function for every row you have ... and then you have to add all row-totals?

kind regards
Sep 20 '07 #3

gits
Expert Mod 5K+
P: 5,384
that is a little bit tricky and depends on how this changes ... you may use something like this:

Expand|Select|Wrap|Line Numbers
  1. var prefix = 'ctl00_contentPlaceHolder_GridView1_';
  2.  
  3. // you may pass this as a param to your function
  4. // here i use: cp = 'ctl02'
  5. var changing_part = cp;
  6.  
  7. var suffix = '_TextBox1';
  8.  
  9. var id = prefix + changing_part + suffix;
  10.  
  11. var node = document.getElementById(id);
i assume that you know how to loop through your lines ... so you call your function with the cp-param each time with a new row.

kind regards
Sep 20 '07 #4

parshupooja
100+
P: 159
Hello
Thank You for help but when i just test it and it shows msg null object. any clue?
Expand|Select|Wrap|Line Numbers
  1. var msg = "";
  2.                                    for (var x = 1; x <= 10; x++)
  3.                                   {
  4.                                             var prefix = "ctl00_contentPlaceHolder_GridView1_ctl0";
  5.                                          var changing_part = x;
  6.                                           var suffix = "_TextBox1";
  7.                                            var id = prefix + changing_part + suffix;
  8.                                            var node = document.getElementById(id);
  9.                                           javascript:window.alert(node);
  10.  
  11.  
that is a little bit tricky and depends on how this changes ... you may use something like this:

Expand|Select|Wrap|Line Numbers
  1. var prefix = 'ctl00_contentPlaceHolder_GridView1_';
  2.  
  3. // you may pass this as a param to your function
  4. // here i use: cp = 'ctl02'
  5. var changing_part = cp;
  6.  
  7. var suffix = '_TextBox1';
  8.  
  9. var id = prefix + changing_part + suffix;
  10.  
  11. var node = document.getElementById(id);
i assume that you know how to loop through your lines ... so you call your function with the cp-param each time with a new row.

kind regards
Sep 20 '07 #5

gits
Expert Mod 5K+
P: 5,384
i think your prefix is wrong .... it seems to contain the variable part?

kind regards
Sep 20 '07 #6

parshupooja
100+
P: 159
actually only value after ctl0 is increasing by one. so i am considering it as a part of prefix

so i thought x would be 1,2,............n and so on

string should be
ctl00_contentPlaceHolder_GridView1_ctlx_TextBox1


Thanks
i think your prefix is wrong .... it seems to contain the variable part?

kind regards
Sep 20 '07 #7

gits
Expert Mod 5K+
P: 5,384
hmmm ... i see ... when do you call the loop? ... it has to be after! the page is fully loaded so that the dom is ready to use ...

kind regards
Sep 21 '07 #8

parshupooja
100+
P: 159
Loop is in the script tag of of aspx page and i am calling this function at
Onchange event of Textboxes, thats means page is fully loaded already , it triggers only when I change value on Textboxes
Expand|Select|Wrap|Line Numbers
  1. <script language =javascript type="text/javascript">
  2.                         function Total(){
  3.  for (var x = 1; x <= 10; x++)
  4.                                     {
  5.                                          var prefix = "ctl00_contentPlaceHolder_GridView1_ctl0";
  6.                                         var changing_part = x;
  7.                                           var suffix = "_TextBox1";
  8.                                           var id = prefix + changing_part + suffix;
  9.                                           var node = document.getElementById(id);
  10. }
  11. }
  12. </script>
  13.  
gridview
Expand|Select|Wrap|Line Numbers
  1.  <asp:TemplateField HeaderText="Out">
  2.                     <ItemTemplate>
  3.                         <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("MorningOut") %>' Width="50px" onChange="Total()"></asp:TextBox>
  4.                     </ItemTemplate>
  5.                 </asp:TemplateField>
  6.  
  7.  
hmmm ... i see ... when do you call the loop? ... it has to be after! the page is fully loaded so that the dom is ready to use ...

kind regards
Sep 21 '07 #9

gits
Expert Mod 5K+
P: 5,384
hi ...

hmmm ... could you please post the html-code? ... when the page is rendered by the browser goto view source and post the html that relates to our problem ... so that we may have a closer look ...

kind regards
Sep 23 '07 #10

Post your reply

Sign in to post your reply or Sign up for a free account.