Tuesday, 7 August 2012

Addition of Two Text Boxes in a Grid View usign Javascript to display the sum in the Text Box of the Same Grid View

Javascript Code


 function addition(txtAttendence) {
        var row = txtAttendence.parentNode.parentNode;
        var rowIndex = row.rowIndex - 1;
             var test = row.cells[1].getElementsByTagName("input")[0].value;
        var component = row.cells[2].getElementsByTagName("input")[0].value;
        var attendance = row.cells[3].getElementsByTagName("input")[0].value;
        var total = row.cells[4].getElementsByTagName("input")[0].value;
       total = Number(test) + Number(component) + Number(attendance);
       row.cells[4].getElementsByTagName("input")[0].value = total;
        return false;
    }



GridView Code



 <asp:GridView ID="gdvInternallist" runat="server" Caption="InternalMarkEntry" CssClass="Grid" EmptyDataText="No Record found" Width="100%"              
  AutoGenerateColumns="False"    >HeaderStyle CssClass="GridHeader" />
<AlternatingRowStyle CssClass="GridAltItem" />
<Columns>:TemplateField HeaderText="Name" >                  
                   <ItemTemplate>
                             <asp:Label ID="lblName" runat="server" Text='<%# Eval("Name") %>' ></asp:Label>
                     </ItemTemplate>
                     </asp:TemplateField>
                     <asp:TemplateField >
           <HeaderTemplate>
                   <asp:Label ID="lblTest" runat="server" ></asp:Label>
           </HeaderTemplate>
                     <ItemTemplate>
                     <asp:TextBox ID="txtTest" runat="server" Height="24px" Width="73px" Text="2" >
</asp:TextBox>
                     </ItemTemplate>
                     </asp:TemplateField>
                     <asp:TemplateField>
                     <HeaderTemplate>
                       <asp:Label ID="lbComponent" runat="server" ></asp:Label>
                     </HeaderTemplate>
                     <ItemTemplate>
                     <asp:TextBox ID="txtComponent" runat="server" Height="24px" Width="73px" ></asp:TextBox>
                     </ItemTemplate>
                     </asp:TemplateField>
                     <asp:TemplateField >
                     <HeaderTemplate>
                     <asp:Label ID="lblAttendence" runat="server" ></asp:Label>
                     </HeaderTemplate>
                     <ItemTemplate>
                     <asp:TextBox ID="txtAttendence" runat="server" Height="24px" Width="73px" onchange="return addition(this)">
</asp:TextBox>
                   
                      </ItemTemplate>
                      </asp:TemplateField>
                      <asp:TemplateField >
                      <HeaderTemplate>
                      <asp:Label ID="lblTotal" runat="server" ></asp:Label>
                      </HeaderTemplate>
                     <ItemTemplate>
                     <asp:TextBox ID="txtTotal" runat="server" Height="24px" Width="73px"  Text="0"></asp:TextBox>
                     </ItemTemplate>
                     </asp:TemplateField>
          </Columns>
</asp:GridView>







To get the values from the Grid Control using the javaScript from controls to make the arithmetic calculation  


No comments:

Post a Comment