Есть небольшой сайт, где нужно сделать возможность покупать товар, колличество товара очень маленькое, по этому загрузка в базу данных не вижу смысла, хотел пойти другим путем в виде стационарной формы на сайте.
есть 3 одинаковых блока с товаром(меняется только цена и картинка):
<div class="item_shop">
<img src="<?php echo get_template_directory_uri();?>/images/*.jpg" alt="*">
<span class="amount_item">
20 €
</span>
<input type="hidden" class="amount_shop" value="20">
<p>Qty:</p><input type="number" class="qty_shop" placeholder="0" name="qnty">
<button class="add_shop">Add to cart</button>
</div>
И есть основная форма, где будет суммироватся колличество и сумма:
<form action="<?php echo $truepath ?>" method="POST">
<input type="disabled" name="qty" id="korzina_qty" class="korzina_input" placeholder="0">
<input type="number" name="amount" id="amount_shop">
<input type="image" class="shop_image" src="<?php echo get_template_directory_uri();?>/images/shoping.png" border="0" name="submit" alt="Shop">
</form>
JS которая суммирует все цифры в первой форме и добавляет в основную:
$(".add_shop").on('click', function(){
var a = $('.amount_shop').val() * $('.qty_shop').val();
$('#amount_shop').val(a + $(this).val());
if($('#korzina_qty').val() == 0){
$('#korzina_qty').val($('.qty_shop').val());
}else{
var b = Number($('.qty_shop').val()) + Number($('#korzina_qty').val());
$('#korzina_qty').val(b);
}
$('.qty_shop').val(0);
})
Но все это не будет работать на всех блоках, а только на первом. как можно реализовать чтобы работало на всех?