Hi,
I have a repeater field with subfields title, price, quanitiy and total. I am trying, using jQuery to calculate price x quantity to be displayed in the total field. Usually i use
var price = parseFloat(jQuery('#price').val(), 10);
var quantitiy= parseFloat(jQuery('#quantity').val(), 10);
var total = price * quantity;
jQuery('#total').val(total);
As you know it really doesnt work since its a repeater field.. Anyone got an idea of how to solve my problem?
Thanks
What is triggering the jquery to run? What element have you attached your JS to.
When using js you need to use field keys
What you need to do is find the current row.
// element represents an field
var row = element.closest('acf-row');
one you have the row then you find a field in the row, I a assuming a field of type “input”
var field = row.find('[data-key="your field key"] .acf-input input');
Thanks for the reply. Got it working now 🙂
jQuery(".acf-repeater .acf-row").each(function(i, element) {
var row = $(element);
var orderrow_quantity = row.find(".orderrow-quantity input").val();
var orderrow_price_before_tax = row.find(".orderrow-price-before-vat input").val();
var orderrow_total_before_tax = orderrow_quantity * orderrow_price_before_tax;
var orderrow_total_after_tax = orderrow_total_before_tax * vat_percentage;
row.find(".orderrow-total-before-vat input").val(orderrow_total_before_tax);
row.find(".orderrow-total-after-vat input").val(orderrow_total_after_tax);
});