Friday, 28 December 2012



Gridview Rows and Columns Value Calculation using Javascript

ex. Just i tried with Invoice application Demo.


   <script type="text/javascript">
      function multiplication(obj)
      {    
          
          var cell = obj.parentNode;               
          var per=obj.value*(0.1236);
          if(obj.value!="")
          {
            cell.parentNode.cells[cell.cellIndex + 1].getElementsByTagName("input")[0].value = per;
            //alert(obj.value*(0.1236));
            cell.parentNode.cells[cell.cellIndex + 2].getElementsByTagName("input")[0].value=parseFloat(obj.value)+parseFloat(per);
                 
       }  
        var gv = document.getElementById('<%=GridView1.ClientID %>');
            var Amount = 0;
            var tax=0;
            var total=0;
            for (var i = 1; i < gv.rows.length - 1; i++){
                if (gv.rows[i].cells[1].childNodes[1].value != '') 
                {
                    Amount = parseFloat(Amount) + parseFloat(gv.rows[i].cells[1].childNodes[1].value);     //getting textbox value
                   
                      tax=parseFloat(tax)+parseFloat(gv.rows[i].cells[2].childNodes[1].value);
                    
                    total=parseFloat(total)+parseFloat(gv.rows[i].cells[3].childNodes[1].value);
                }
             
            }
            document.getElementById('<%=Label1.ClientID %>').textContent = Amount.toFixed(2);
           
              document.getElementById('<%=Label2.ClientID %>').textContent = tax.toFixed(2);
          
            
             document.getElementById('<%=Label3.ClientID %>').textContent = total.toFixed(2);
               
       }
      function Calculatesum()
      {
        var gv = document.getElementById('<%=GridView1.ClientID %>');
            var Amount = 0;
            var tax=0;
            var total=0;
            for (var i = 1; i < gv.rows.length - 1; i++){
                if (gv.rows[i].cells[1].childNodes[1].value != '') 
                {
                    Amount = parseFloat(Amount) + parseFloat(gv.rows[i].cells[1].childNodes[1].value);     //getting textbox value
                   
                      tax=parseFloat(tax)+parseFloat(gv.rows[i].cells[2].childNodes[1].value);
                    
                    total=parseFloat(total)+parseFloat(gv.rows[i].cells[3].childNodes[1].value);
                }
             
            }
            document.getElementById('<%=Label1.ClientID %>').textContent = Amount.toFixed(2);
           
              document.getElementById('<%=Label2.ClientID %>').textContent = tax.toFixed(2);
          
            
             document.getElementById('<%=Label3.ClientID %>').textContent = total.toFixed(2);
           
      }

    </script>


===================================================================>


       <asp:GridView ID="GridView1" AutoGenerateColumns="false" runat="server">
        <Columns>
          <asp:TemplateField HeaderText="Product Name">
         <ItemTemplate>
             <asp:Label ID="Label4" runat="server" Text='<%#Eval("productname") %>'></asp:Label>
         </ItemTemplate>
        </asp:TemplateField>    
       
        <asp:TemplateField HeaderText="Amount">
         <ItemTemplate>
             <asp:TextBox ID="TextBox1" onblur="multiplication(this);return false" runat="server"></asp:TextBox>
         </ItemTemplate>
        </asp:TemplateField>      
         <asp:TemplateField HeaderText="Tax">
         <ItemTemplate>
             <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
         </ItemTemplate>
        </asp:TemplateField>      
         <asp:TemplateField HeaderText="Total">
         <ItemTemplate>
             <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
         </ItemTemplate>
        </asp:TemplateField>
        </Columns>
        </asp:GridView>

No comments:

Post a Comment