ahmed salah

ahmed salah

  • 1.6k
  • 530
  • 125.7k

How To Make Total For Every Column By Using Jquery

Jul 30 2016 5:53 PM
Name salary Bonus Deduction total
mickel 500 600 300 800
adil 600 600 600 600
total 1100 1200 900 1400
how to make total for every column meaning how to do total found last line for all column

total 1100 1200 900 1400
my code as following
  1. @{  
  2.     Layout = null;  
  3. }  
  4.   
  5. <!DOCTYPE html>  
  6.   
  7. <html>  
  8. <head>  
  9.     <meta name="viewport" content="width=device-width" />  
  10.     <title>Index</title>  
  11.     <script src="~/Scripts/jquery-1.10.2.js"></script>  
  12.     <script>  
  13.         $(function () {  
  14.             $("#btn").click(function () {  
  15.                 var x = $("#txt1").val();  
  16.                 var y = $("#txt2").val();  
  17.                 var z = $("#txt3").val();  
  18.                 var M = $("#txt4").val();  
  19.                 var L = parseInt(y) + parseInt(z) - parseInt(M);  
  20.   
  21.                 $("#tb").append("<tr> <td>" + x + "</td> <td>" + y + "</td> <td>" + z + "<td>" + M + "</td><td>" + L + "</td></tr>");  
  22.             });  
  23.             $("#tb").on("click""tr", function () {  
  24.   
  25.                 $(this).find("td").slice(0, 4).prop("contenteditable"true);  
  26.   
  27.             });  
  28.   
  29.         });  
  30.     </script>  
  31. </head>  
  32. <body>  
  33.     <div>  
  34.         Name<input type="text" id="txt1" /><br />  
  35.         Salary<input type="text" id="txt2" /><br />  
  36.         Bonus<input type="text" id="txt3" /><br />  
  37.         Deduction<input type="text" id="txt4" /><br />  
  38.         <input type="button" value="add" id="btn" />  
  39.         <table>  
  40.             <thead>  
  41.                 <tr>  
  42.                     <td>  
  43.                         Name  
  44.                     </td>  
  45.                     <td>  
  46.                         Salary  
  47.   
  48.                     </td>  
  49.                     <td>  
  50.                         Bonus  
  51.                     </td>  
  52.                     <td>  
  53.                         Deduction  
  54.                     </td>  
  55.                     <td>  
  56.                         total  
  57.                     </td>  
  58.                 </tr>  
  59.             </thead>  
  60.             <tbody id="tb" class="tb1"></tbody>  
  61.         </table>  
  62.     </div>  
  63. </body>  
  64. </html>            
 
 

Answers (1)