如何从动态表中添加2个数据?

时间:2017-07-31 09:24:10

标签: jquery html asp.net

请帮助我,我是jquery的新手,我想从列a找到累积 和b,然后将添加两列的累积值。 image of output and the way it would be dispalyed



<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
	<script type="text/javascript">
		
		function addRow(tableID) {

			var table = document.getElementById(tableID);

			var rowCount = table.rows.length;
			var row = table.insertRow(rowCount);

			var colCount = table.rows[0].cells.length;

			for(var i=0; i<colCount; i++) {

				var newcell	= row.insertCell(i);

				newcell.innerHTML = table.rows[0].cells[i].innerHTML;
				//alert(newcell.childNodes);
				switch(newcell.childNodes[0].type) {
					case "text":
							newcell.childNodes[0].value = "";
							break;
					case "checkbox":
							newcell.childNodes[0].checked = false;
							break;
					case "select-one":
							newcell.childNodes[0].selectedIndex = 0;
							break;
				}
			}
		}

		function deleteRow(tableID) {
			try {
			var table = document.getElementById(tableID);
			var rowCount = table.rows.length;

			for(var i=0; i<rowCount; i++) {
				var row = table.rows[i];
				var chkbox = row.cells[0].childNodes[0];
				if(null != chkbox && true == chkbox.checked) {
					if(rowCount <= 1) {
						alert("Cannot delete all the rows.");
						break;
					}
					table.deleteRow(i);
					rowCount--;
					i--;
				}


			}
			}catch(e) {
				alert(e);
			}
		}
		function findTotal(){
			var arr = document.getElementsByName('qty');
			var tot=0;
			for(var i=0;i<arr.length;i++){
				if(parseInt(arr[i].value))
					tot += parseInt(arr[i].value);
			}
			document.getElementById('total').value = tot;
		}
		function findTotalAmount(){
			var arr = document.getElementsByName('amount');
			var totamount=0;
			for(var i=0;i<arr.length;i++){
				if(parseInt(arr[i].value))
					totamount += parseInt(arr[i].value);
			}
			document.getElementById('totalamount').value = totamount;
		}
		
		
		$(document).ready(function(e){
		$("input").change(function(){
			var toplam=0;
			$("input[name=total]").each(function(){
				toplam = toplam + parseInt($(this).val());
			})
			$("input[name=toplam_gider]").val(toplam);
		});
});
	</SCRIPT>
&#13;
<BODY>
<HTML>
	



	<TABLE id="dataTable" width="640" border="1">
		<TR>
			<TD width="20"><input type="checkbox" name="chk"/></TD>
			<TD width="283"><input type="text" onblur="findTotal()" name="qty" value="0"/></TD>
			<TD width="124"><input type="text" onblur="findTotalAmount()" name="amount" value="0"/></TD>
			<td width="74"><input type="button" value="Add Row" onClick="addRow('dataTable')" /></td>
			<td width="105"><input type="button" value="Delete Row" onClick="deleteRow('dataTable')" /></td>
		</TR>
		
	</TABLE>
	<br /> 
	GST Total : <input type="text" name="total" id="total"  value="0"/> <br />
	Total Amount: <input type="text" name="total" id="totalamount"  value="0"/><br />
	Grand Total: <input type="text" name="toplam_gider" />

</BODY>
</HTML>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

您的意思是从列中添加每个值然后将它们一起添加吗?

您可以使用JQuery .each()函数浏览表格。

&#13;
&#13;
$(function(){
  for(var i=0;i<$('table tr:nth-of-type(1) td').length;i++){
    var columnTotal = 0;
    $('table tr td:nth-of-type('+(i+1)+')').each(function(){
      columnTotal+=+$(this).text();
    });
    
    $('body').append('<p>Total column '+(i+1)+' = <span class="subtotal">'+columnTotal+'</span></p>');
  }
  
  var totalTotal=0;
  $('.subtotal').each(function(){
    totalTotal+=+$(this).text();
  });
  $('body').append('<p class="total">Total total = '+totalTotal+'</p>');
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>10</td>
    <td>16</td>
    <td>24</td>
    <td>9</td>
  </tr>
  <tr>
    <td>70</td>
    <td>16</td>
    <td>25</td>
    <td>9</td>
  </tr>
  <tr>
    <td>10</td>
    <td>16</td>
    <td>524</td>
    <td>9</td>
  </tr>
  <tr>
    <td>10</td>
    <td>18</td>
    <td>24</td>
    <td>9</td>
  </tr>
</table>
&#13;
&#13;
&#13;