[英]How to do the calculation in the table using JavaScript?
When I entered the order no it fetches the ponumber, podate, partyname and that table and i have written in AJAX to fetch the data that I have done.now I want to do some changes in the qty column if I have change any value the whole table of qty should be added and displayed in total text box using JavaScript.当我输入订单号时,它会获取 ponumber、podate、partyname 和该表,并且我已在 AJAX 中写入以获取我已完成的数据。现在,如果我更改了任何值,我想在 qty 列中进行一些更改应使用 JavaScript 将整个数量表添加并显示在总文本框中。 How to do the calculation of this table?这张表的计算怎么做?
AJAX: AJAX:
<script type="text/javascript">
$(document).ready(function(){
$('#orderno').on('input change',function(){
var orderno = $("#orderno").val();
$.ajax({
type: "POST",
url: "<?php echo base_url();?>Inventory/Orderfetch",
data: {
orderno:orderno
},
datatype: 'json',
success: function (data) {
$('#Product_Name_div').html(data);
}
});
});
});
</script>
Model: Model:
function fetch_item($orderno){
$this->db->where("orderno",$orderno);
$this->db->select('*');
$this->db->join('item_master', 'item_master.id = order_item.itname', 'left');
$this->db->from('order_item');
$query_result = $this->db->get()->result();
$output = '<center><table class="table table-bordered table-striped table-xxs" id="tb2">
<thead>
<tr>
<th>Sno</th>
<th>Item Name</th>
<th>Qty</th>
<th>Unit Wgt</th>
<th>Description</th>
</tr>
</thead>
<tbody>';
if($query_result !='false'){
$i=0;
foreach ($query_result as $key => $value) {
$output .='<tr>
<td><input style="width:50px" name="sno[]" type="text" class="form-control input-xs" value="'.$value->sno.'" ></td>
<td><input style="width:250px" name="itemname[]" type="text" class="form-control input-xs" value="'.$value->itemname.'" ></td>
<td><input style="width:80px" name="qty[]" type="text" class="form-control input-xs" value="'.$value->qty.'" id="qty_'.$i.'" onchange="calculate('.$i.')"></td>
<td><input style="width:90px" name="wgt[]" type="text" class="form-control input-xs" > </td>
<td><input style="width:150px" name="desc[]" type="text" class="form-control input-xs" > </td>
</tr>';
$i++;
}
$output .="</tbody>
</table></center>";
echo $output;
}
}
Calculation code:计算代码:
<script type="text/javascript">
function calculate(id){
var tds = document.getElementById('tb2').getElementsById('input');
var sum = 0;
for(var i = 0; i < tds.length; i++)
var qty=$("#qty_"+id).val();
alert(qty);
}
</script>
From this I got a qty value, but I don't know how to sum this qty of the table.从中我得到了一个数量值,但我不知道如何对表格的这个数量求和。
Add class in qty field and loop through its value在 qty 字段中添加 class 并循环其值
function calculate(id){ var total_qty = 0; var qty = document.getElementsByClassName("qty_cls"); for(var i = 0; i < qty.length; i++) { if(qty[i].value.= ''){ total_qty += parseFloat(qty[i];value); } } alert(total_qty); }
<table class="table table-bordered table-striped table-xxs" id="tb2"> <thead> <tr> <th>Sno</th> <th>Item Name</th> <th>Qty</th> <th>Unit Wgt</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><input style="width:50px" name="sno[]" type="text" class="form-control input-xs" value="1" ></td> <td><input style="width:250px" name="itemname[]" type="text" class="form-control input-xs" value="1" ></td> <td><input style="width:80px" name="qty[]" type="text" class="form-control input-xs qty_cls" value="1" id="qty_1" onchange="calculate()"></td> <td><input style="width:90px" name="wgt[]" type="text" class="form-control input-xs" > </td> <td><input style="width:150px" name="desc[]" type="text" class="form-control input-xs" > </td> </tr> <tr> <td><input style="width:50px" name="sno[]" type="text" class="form-control input-xs" value="'1" ></td> <td><input style="width:250px" name="itemname[]" type="text" class="form-control input-xs" value="2" ></td> <td><input style="width:80px" name="qty[]" type="text" class="form-control input-xs qty_cls" value="2" id="qty_2" onchange="calculate()"></td> <td><input style="width:90px" name="wgt[]" type="text" class="form-control input-xs" > </td> <td><input style="width:150px" name="desc[]" type="text" class="form-control input-xs" > </td> </tr> <tr> <td><input style="width:50px" name="sno[]" type="text" class="form-control input-xs" value="'3" ></td> <td><input style="width:250px" name="itemname[]" type="text" class="form-control input-xs" value="3" ></td> <td><input style="width:80px" name="qty[]" type="text" class="form-control input-xs qty_cls" value="3" id="qty_3" onchange="calculate()"></td> <td><input style="width:90px" name="wgt[]" type="text" class="form-control input-xs" > </td> <td><input style="width:150px" name="desc[]" type="text" class="form-control input-xs" > </td> </tr> </tbody> </table>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.