Gridview to calculate percenatge value based on textbox value RSS

• • Reply
  

  Priya_here

  Member

  709 Points

  1855 Posts

  Gridview to calculate percenatge value based on textbox value

  Dec 22, 2012 09:49 AM|LINK

  Hi..

  I have one textbox1 let us consider it has 4000

  this is my aspx gridview

  <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="CS" ShowFooter="True">

          <Columns>

              <asp:BoundField DataField="Selection" HeaderText="Selection" SortExpression="Selection" />

              <a

              <asp:TemplateField HeaderText="Enter Qty">

                              

                                  <ItemTemplate>

                                      <asp:TextBox ID="TextBox1" runat="server" TabIndex="7" Width="73px"></asp:TextBox>

                                  </ItemTemplate>

                                  <FooterTemplate>

                                 

                                   <span style="font-size: 14pt; color: maroon">

                                      Total</span><br />

                                      <asp:Label ID="E" CssClass="myclass1" runat="server" Font-Size="16pt" ForeColor="Teal"></asp:Label>

                                      <br />

                                      <asp:HiddenField ID="hiddenTotal1" runat="server" />

                                    

                                 

                                  </FooterTemplate>

                              </asp:TemplateField>

              

              <asp:TemplateField HeaderText="Actual Percentage">

                              

                                  <ItemTemplate>

                                      <asp:Labekl 1ID="APLabel" runat="server" TabIndex="7" Width="73px"></asp:Label>

                                  </ItemTemplate>

                                  <FooterTemplate>                             

                                      <br />                               

                                      <span style="font-size: 14pt; color: maroon">

                                      Total</span><br />

                                      <asp:Label ID="F" CssClass="myclass2" runat="server" Font-Size="16pt" ForeColor="Teal"></asp:Label>

                                      <br />

                                      <asp:HiddenField ID="hh" runat="server" />

                                    

                                   

                                  </FooterTemplate>

                              </asp:TemplateField>

                              

             

          </Columns>

      </asp:GridView>

   

  Now on load it shows like this

  Selection         EnterQty       Percentage

  A                                            

  B                                            

  C                                            

  If user enter like this

  Selection         EnterQty       Percentage

  A                             500        

  B                             2000      

  C                             1500      

   

  Then i need to calculate gridview enter qty values to my textbox that’s is it contain 4000 on jquery or javascript without postback to show like this

  Selection         EnterQty       Percentage

  A                             500                         12.5%

  B                             2000                       50%

  C                             1500                       37.5%

   

  Thank you

   

  • Edited by Priya_here on Dec 23, 2012 08:26 AM
• • Reply
  

  raju dasa

  Star

  14392 Points

  2447 Posts

  Re: Gridview to calculate percenatge value based on textbox value

  Dec 22, 2012 02:28 PM|LINK

  Hi,

  You have to use jquery, check this post:

  http://forums.asp.net/t/1630768.aspx/1

  update it to have ur calculation, and use onblur event on textboxes.

  Happy Coding ! Mark as Answer if it helps.
  rajudasa.blogspot.com  ||  blog@opera
• • Reply
  

  Priya_here

  Member

  709 Points

  1855 Posts

  Re: Gridview to calculate percenatge value based on textbox value

  Dec 22, 2012 02:45 PM|LINK

  It would be thankfull if you post a complete code...

  thank you

• • Reply
  

  roopeshreddy

  All-Star

  20143 Points

  3327 Posts

  Re: Gridview to calculate percenatge value based on textbox value

  Dec 23, 2012 09:26 AM|LINK

  Hi,

  Check the sample - 

  <asp:GridView runat="server" ID="gridView"  AutoGenerateColumns="false">
          <Columns>
              <asp:TemplateField>
                  <ItemTemplate>
                      <asp:Label Text='<%#Eval("Name")%>' runat="server" />
                  </ItemTemplate>
              </asp:TemplateField>
              <asp:TemplateField>
                  <ItemTemplate>
                      <asp:TextBox runat="server" ID="txt1" onblur="CalculatePercentage(this.id);" />
                  </ItemTemplate>
              </asp:TemplateField>
              <asp:TemplateField>
                  <ItemTemplate>
                      <asp:TextBox runat="server" ID="txt2" CssClass="myCss" />
                  </ItemTemplate>
              </asp:TemplateField>
          </Columns>
      </asp:GridView>
  
      //This is the textbox which holds the constant vale
      <asp:TextBox runat="server" ID="txtTotalValue" />
     
      <script type="text/javascript">
          function CalculatePercentage(ctrlID) {
              var totalAmount = document.getElementById("<%=txtTotalValue.ClientID %>").value;
              var data = document.getElementById(ctrlID).value;
              var percentageAmount = (data / totalAmount) * 100;
              //alert(percentageAmount + ctrlID);
              $('#' + ctrlID).closest("tr").find(".myCss").val(percentageAmount);
          }
      </script>

  var rows = new []
              {
                  new
                  {
                      Name="A"
                  },
                  new
                  {
                      Name="B"
                  },
                  new
                  {
                      Name="C"
                  }
  
              };
  
              gridView.DataSource = rows;
              gridView.DataBind();

  
  

  Hope it helps u...

  Thanks & Regards
  Roopesh Reddy C
  Roopesh's Space
  
  • Edited by roopeshreddy on Dec 23, 2012 09:30 AM
  • Edited by roopeshreddy on Dec 23, 2012 09:33 AM
  • Marked as answer by Priya_here on Dec 23, 2012 09:36 AM
• • Reply
  

  Priya_here

  Member

  709 Points

  1855 Posts

  Re: Gridview to calculate percenatge value based on textbox value

  Dec 23, 2012 09:32 AM|LINK

  hi

  Im getting this error why...

  

  Let me know why..?