Reputation: 497
I try to get the grand total using each loop but it return nothing
[![enter image description here][1]][1]
here is html code
<div class="main-wrapper">
<div class="row">
<div class="col-md-4">
<label>quentity</label>
<input type="text" name="quantity[]" id="quantity">
</div>
<div class="col-md-4">
<label>price</label>
<input type="text" name="price[]" id="price">
</div>
<div class="col-md-4">
<label>total</label>
<input type="text" name="total[]" id="total">
<a class="btn btn-danger btn1" onclick="add()">+</a>
</div>
</div>
<div class="append">
</div>
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-4"></div>
<div class="col-md-4 g-total"><label>gtotal</label><input type="text" name="g-total" id="gtotal"></div>
</div>
</div>
here is script code
$('.main-wrapper').on("change","#price",function(){
var gtotal =0;
var price = $(this).val();
var quantity = $(this).parents('.row').find('#quantity').val();
function multi(){
var total = price * quantity;
return total;
}
$(this).parents('.row').find('#total').val(multi());
})
var gtotal = 0;
$('#total').each(function(){
gtotal += $(".main-wrapper").children().find('#total').val();
console.log(gtotal);
})
value in total comes from quality and price and its working but each loop on total not working Thanks
Upvotes: 0
Views: 148
Reputation: 847
This should work:
$('.main-wrapper').on("change", "#price", function() {
var gtotal = 0;
var price = $(this).val();
var quantity = $(this).parents('.row').find('#quantity').val();
function multi() {
var total = price * quantity;
return total;
}
$(this).parents('.row').find('#total').val(multi());
});
$("#getgrandtotalbtn").click(function() {
var gtotal = 0;
$('.total').each(function() {
gtotal += parseInt($(this).val());
})
$("#gtotal").val(gtotal);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="main-wrapper">
<div class="row">
<div class="col-md-4">
<label>quentity</label>
<input type="text" name="quantity[]" id="quantity">
</div>
<div class="col-md-4">
<label>price</label>
<input type="text" name="price[]" id="price">
</div>
<div class="col-md-4">
<label>total</label>
<input type="text" name="total[]" class="total" id="total">
<a class="btn btn-danger btn1" onclick="add()">+</a>
</div>
</div>
<div class="row">
<div class="col-md-4">
<label>quentity</label>
<input type="text" name="quantity[]" id="quantity">
</div>
<div class="col-md-4">
<label>price</label>
<input type="text" name="price[]" id="price">
</div>
<div class="col-md-4">
<label>total</label>
<input type="text" name="total[]" class="total" id="total">
<a class="btn btn-danger btn1" onclick="add()">+</a>
</div>
</div>
<div class="append">
</div>
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-4"></div>
<div class="col-md-4 g-total"><label>gtotal</label><input type="text" name="g-total" id="gtotal"></div>
</div>
<button id="getgrandtotalbtn">Calculate</button>
</div>
Upvotes: 1