我如何添加" Div"代替 表& TR
我用div而不是Table和tr尝试了很多次 并失败了 我即将创建发票计算
如果有人知道这一点,请告诉我 谢谢
$(window).load(function(){
$(document).ready(function () {
// copy customer details to shipping
$('input.copy-input').on("change keyup paste", function () {
var thisID = $(this).attr('id');
$('input#' + thisID + "_ship").val($(this).val());
});
// add new product row on invoice
var cloned = $('#invoice_table tr:last').clone();
$(".add-row").click(function (e) {
e.preventDefault();
cloned.clone().appendTo('#invoice_table');
});
calculateTotal();
$('#invoice_table').on('change keyup paste', '.calculate', function() {
updateTotals(this);
calculateTotal();
});
function updateTotals(elem) {
var tr = $(elem).closest('tr'),
quantity = $('[name="invoice_product_qty[]"]', tr).val(),
price = $('[name="invoice_product_price[]"]', tr).val(),
percent = $('[name="invoice_product_discount[]"]', tr).val(),
subtotal = parseInt(quantity) * parseFloat(price);
if(percent && $.isNumeric(percent) && percent !== 0){
subtotal = subtotal - ((parseInt(percent) / 100) * subtotal);
}
$('.calculate-sub', tr).val(subtotal.toFixed(2));
}
function calculateTotal(){
var grandTotal = 0.0;
var totalQuantity = 0;
$('.calculate-sub').each(function(){
grandTotal += parseFloat($(this).val()) ;
});
$('.invoice-sub-total').text(parseFloat(grandTotal ).toFixed(2) );
}
});
});//]]>

答案 0 :(得分:0)
$(window).load(function(){
$(document).ready(function () {
// copy customer details to shipping
$('input.copy-input').on("change keyup paste", function () {
var thisID = $(this).attr('id');
$('input#' + thisID + "_ship").val($(this).val());
});
// add new product row on invoice
var cloned = $('#invoice_table tr:last').clone();
$(".add-row").click(function (e) {
e.preventDefault();
cloned.clone().appendTo('#invoice_table');
});
calculateTotal();
$('#invoice_table').on('change keyup paste', '.calculate', function() {
updateTotals(this);
calculateTotal();
});
function updateTotals(elem) {
var tr = $(elem).closest('tr'),
quantity = $('[name="invoice_product_qty[]"]', tr).val(),
price = $('[name="invoice_product_price[]"]', tr).val(),
percent = $('[name="invoice_product_discount[]"]', tr).val(),
subtotal = parseInt(quantity) * parseFloat(price);
if(percent && $.isNumeric(percent) && percent !== 0){
subtotal = subtotal - ((parseInt(percent) / 100) * subtotal);
}
$('.calculate-sub', tr).val(subtotal.toFixed(2));
}
function calculateTotal(){
var grandTotal = 0.0;
var totalQuantity = 0;
$('.calculate-sub').each(function(){
grandTotal += parseFloat($(this).val()) ;
});
$('.invoice-sub-total').text(parseFloat(grandTotal ).toFixed(2) );
}
});
});//]]>

<style type="text/css">
body {
padding: 2em 0;
}
.panel-body {
padding: 15px 15px 0 15px;
}
}
.float-left {
float: left !important;
}
.float-right {
float: right !important;
}
.margin-bottom {
margin-bottom: 1em;
}
.margin-top {
margin-top: 1em;
}
/* Form validation */
#response {
margin: 0 1em 1em 1em;
}
</style>
&#13;
<head><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
<h1>Create invoice</h1>
<hr>
<div class="row">
<div class="col-xs-6 text-right">
<table class="table table-bordered" id="invoice_table">
<tbody>
<tr>
<td>
<div class=" form-group">
<select name="invoice_product[]">
<option>Versa Table - Wildberry</option><option>Versa Table - Aubergine</option><option>Versa Table - Blue Jazz</option><option>Versa Table - Tundra Spring</option> </select>
</div>
</td>
<td>
<div class=" form-group form-group-sm">
<input class="form-control calculate" name="invoice_product_qty[]" value="1" type="text">
</div>
</td>
<td>
<div class="input-group input-group-sm">
<span class="input-group-addon">£</span>
<input class="form-control calculate" name="invoice_product_price[]" value="0.00" aria-describedby="sizing-addon1" type="text">
</div>
</td>
<td>
<div class=" form-group form-group-sm">
<input class="form-control calculate" name="invoice_product_discount[]" placeholder="Enter % or value (ex: 10% or 10.50)" type="text">
</div>
</td>
<td><div class=" form-group form-group-sm">
<div class="col-lg-2">
<input type="text" name="sub_total" class="form-control calculate-sub" id="subtotal" value="0.00" aria-describedby="sizing-addon1" disabled>
</div>
</td>
</tr>
</tbody>
</table>
<div class="row text-right">
<div class="col-xs-2 col-xs-offset-8">
<p>
<strong>
Sub Total: <br>
TAX/VAT: <br>
Total: <br>
</strong>
</p>
</div>
<div class="col-xs-2">
<strong>
£<span class="invoice-sub-total">20.00</span> <br>
£<span class="invoice-vat">0.00</span> <br>
£<span class="invoice-total">0.00</span> <br>
</strong>
</div>
</div>
&#13;