I am fairly new to PHP and Javascript programming. Currently I am working on a checkout component for an ecommerce website. I have an amount value for a product that is inside a span element and it's changing value according to the quantity the user selects. I need to grab these two values (quantity and value) and pass them to another PHP page. What's the best approach for doing this?
</div> <!-- slider-nav.// -->
</article> <!-- gallery-wrap .end// -->
</aside>
<aside class="col-sm-7">
<article class="p-5">
<h3 class="title mb-3" id="product-title">Colocar o nome do produto </h3>
<div class="mb-3">
<var class="price h3 text-warning">
<span class="currency">EU €</span><span class="num" id="big_valor">29.99</span>
</var>
</div> <!-- price-detail-wrap .// -->
<dl>
<dt>Descrição</dt>
<dd><p>Here goes description consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco </p></dd>
</dl>
<dl class="row">
<dt class="col-sm-3">Modelo</dt>
<dd class="col-sm-9">12345611</dd>
<dt class="col-sm-3">Cor</dt>
<dd class="col-sm-9">Azul e Branco </dd>
<dt class="col-sm-3">Entrega</dt>
<dd class="col-sm-9">Portugal e Espanha</dd>
</dl>
<hr>
<div class="row">
<div class="col-sm-5">
<dl class="dlist-inline">
<dt>Quantidade: </dt>
<dd>
<select class="form-control form-control-sm" style="width:70px;" onchange="calcular();" id="selector">
<option> 1 </option>
<option> 2 </option>
<option> 3 </option>
</select>
</dd>
</dl> <!-- item-property .// -->
</div> <!-- col.// -->
</div> <!-- row.// -->
<hr>
<a href="customer_order_form.php" class="btn btn-primary" click="sendInfo();"> Comprar </a>
</article> <!-- card-body.// -->
</aside> <!-- col.// -->
</div> <!-- row.// -->
</div> <!-- card.// -->
</div>
</div>
Javascript:
$(document).ready(function() {
$(".item-gallery a").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 800,
'speedOut' : 200,
'overlayShow' : false,
'cyclic' : true,
}).click(function(e){
var image_name = $(this).attr('href'); $(".img-big-wrap div a img").attr('src',image_name);
})
}); //END OF DOCUMENT READY
function calcular(){
let select_value = document.getElementById("selector").value;
let amount = select_value*29.99;
$('#big_valor').html(amount);
}