perform sum of textbox values and display the total in gridview footer row textbox RSS

• • Reply
  

  smiley_jatin

  Member

  4 Points

  48 Posts

  perform sum of textbox values and display the total in gridview footer row textbox

  Feb 07, 2009 11:13 AM|LINK

  i have a gridview in which i have added two textboxes .

  the second textbox is placed in footer of gridview

  wht i want is when the user enters values in the first textbox the total of these textboxes should be displayed in footer row.

  Pls help

  • Moved by jeff@zina.com on Feb 07, 2009 12:49 PM
• • Reply
  

  IamSrikanthR...

  Participant

  1764 Points

  323 Posts

  Re: perform sum of textbox values and display the total in gridview footer row textbox

  Feb 09, 2009 11:14 AM|LINK

  Hi smiley_jatin,

  You can do the following for ur requirement:

  A sample aspx is as follows:

  <asp:GridView ShowFooter="true" ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound" AutoGenerateColumns="false">

  <Columns>

  <asp:TemplateField>

  <ItemTemplate>

  <asp:TextBox ID="TextBox1" runat="server" Text='<%# Eval("employeeid") %>'></asp:TextBox>

  </ItemTemplate>

  </asp:TemplateField>

  <asp:TemplateField>

  <FooterTemplate>

  <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

  </FooterTemplate>

  </asp:TemplateField>

  </Columns>

  </asp:GridView>

  and the csharp code is as shown below:

  int total = 0;protected void Page_Load(object sender, EventArgs e)

  {

  SqlConnection connection = new SqlConnection("user id=4545; pwd=4545; Initial Catalog=Northwind; Data Source=uiui");

  SqlCommand command = new SqlCommand("Select employeeid from employees", connection);

  SqlDataAdapter adapter = new SqlDataAdapter(command);

  DataTable dtCustomers = new DataTable();

  adapter.Fill(dtCustomers);

  GridView1.DataSource = dtCustomers;

  GridView1.DataBind();

  }

  protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)

  {

  if (e.Row.RowType == DataControlRowType.DataRow)

  {

  TextBox TextBox1 =(TextBox) e.Row.FindControl("TextBox1");total += Convert.ToInt32(TextBox1.Text);

  }

  else if (e.Row.RowType == DataControlRowType.Footer)

  {

  TextBox TextBox2 = (TextBox)e.Row.FindControl("TextBox2");

  TextBox2.Text = total.ToString();

  }

  }

  Hope it helps.

  Please do not forget to click Mark As Answer on the post that helped you.
  
  Regards,
  Iam Srikanth Reddy.
• • Reply
  

  smiley_jatin

  Member

  4 Points

  48 Posts

  Re: perform sum of textbox values and display the total in gridview footer row textbox

  Feb 11, 2009 05:39 AM|LINK

  thanks for the reply

  but i guess u didnt get my question

  i wanted to perform addition of values entered by the user and display it in the footer row of gridview

  i can perform the addition when i am loading the values from the database.but wht i am really trying to do is when the grid loads there is empty and editable column that has textbox in it .now the user enters values in it .as the user enters values in it the addition of these values entered in the textbox are added and displayed in the footer

  pls help

• • Reply
  

  IamSrikanthR...

  Participant

  1764 Points

  323 Posts

  Re: perform sum of textbox values and display the total in gridview footer row textbox

  Feb 11, 2009 08:50 AM|LINK

  Hi smiley_jatin,

  Look at the sample I have created which matches ur requirement. This adds the values as soon as keyup event is raised:

  GridView Code:

  <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" ShowFooter="true">

  <Columns>

  <asp:BoundField DataField="SNo" HeaderText="SNo" />

  <asp:TemplateField>

  <ItemTemplate>

  <asp:TextBox ID="TextBox1" onkeyup="javascript:Add();" runat="server"></asp:TextBox>

  </ItemTemplate>

  <FooterTemplate>

  <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

  </FooterTemplate>

  </asp:TemplateField>

  </Columns>

  </asp:GridView>

  javascript code:

  <script language="javascript">

  function Add()

  {

  //alert('Called');

  var rows=document.getElementsByTagName('TR');

  total=0;

  for(i=1;i<rows.length-1;i++)

  {

  if(rows[i].children[1].children[0].value.trim()!="")

  {

  total+=parseInt(rows[i].children[1].children[0].value);

  }

  }

  rows[rows.length-1].children[1].children[0].value=total;

  total=0;

  }

  </script>

  and C# Code:

  protected void Page_Load(object sender, EventArgs e)

  {

  DataTable dtSample = new DataTable();

  dtSample.Columns.Add("SNo",typeof(string));

  dtSample.Columns.Add("Value", typeof(string));for (int i = 0; i < 10; i++)

  {

  DataRow drRow = dtSample.NewRow();

  drRow["SNo"] = i + 1;

  dtSample.Rows.Add(drRow);

  }

  GridView1.DataSource = dtSample;

  GridView1.DataBind();

  }

  Hope it helps.

  Please do not forget to click Mark As Answer on the post that helped you.
  
  Regards,
  Iam Srikanth Reddy.
  • Marked as answer by Lynn Liu - MSFT on Feb 13, 2009 09:01 AM
• • Reply
  

  smiley_jatin

  Member

  4 Points

  48 Posts

  I had no idea how post a new query so i am posting my question here.sorry for the trouble.

  May 04, 2009 07:21 AM|LINK

  wht i want to achieve is that i want to display an image when a button is clicked for sometime and then after the process is complete i want to hide the image.pls help
• • Reply
  

  smiley_jatin

  Member

  4 Points

  48 Posts

  Re: perform sum of textbox values and display the total in gridview footer row textbox

  Aug 12, 2009 08:24 AM|LINK

  first of all create arrays of all the textboxes in ur aspx.cs page then call a javascript on the onblur function of the textbox .In the javascript create loop for array length then get single itme one by one and add that value in  a

  variable and then use document.getelementbyidfooter id.value=variable\

  that does it

• • Reply
  

  kinjal20

  Member

  2 Points

  1 Post

  Re: perform sum of dropdown values (column1+coulmn2+column3) and display the total in gridview la...

  Feb 11, 2010 02:54 PM|LINK

  JAVASCRIPT

  
  

  <script type="text/javascript" language="javascript">
      var tmpVal = 0;
  
      function getTempVal(ddList) {
          var ddVal = ddList.options[ddList.selectedIndex].text;
          tmpVal = parseInt(ddVal);
      }
      function getTotal(getValue, index) {
          var sum = 0;
          var total = document.getElementById("ctl00_ContentPlaceHolder2_GridView1_ctl0" + index + "_txtTotal");
          sum = parseInt(total.value) - parseInt(tmpVal) + parseInt(getValue);
          total.value = sum;
          this.blur();
      }
  </script>

  
  

  Code Behind (C#)
  

  protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
      {
          try
          {
              if (e.Row.RowType == DataControlRowType.DataRow)
              {
                  DropDownList ddl1 = e.Row.FindControl("ddl1") as DropDownList;
                  DropDownList ddl2 = e.Row.FindControl("ddl2") as DropDownList;
                  DropDownList ddl3 = e.Row.FindControl("ddl3") as DropDownList;
  
                  int rowIndex = e.Row.RowIndex + 2;   //this is used to get running id for textbox

  
                  ddl1.Attributes.Add("onfocus", "getTempVal(this)");
                  ddl1.Attributes.Add("onchange", "javascript:getTotal(this.value,'" + rowIndex + "');");
                  ddl2.Attributes.Add("onfocus", "getTempVal(this)");
                  ddl2.Attributes.Add("onchange", "javascript:getTotal(this.value,'" + rowIndex + "');");
                  ddl3.Attributes.Add("onfocus", "getTempVal(this)");
                  ddl3.Attributes.Add("onchange", "javascript:getTotal(this.value,'" + rowIndex + "');");
  
               }
          }
          catch { }
      }

  
  

  
  

  ---You can do the same for calulating totals from textbox. You can also do the column level totals and it's a very easy.