how to update the price if quantity changed in cart

Question

I am making the Review Cart & Checkout form. IF user want to change the quantity I want that if quantity is changed the price of it will be changed automatically.

Please help to adjust the code in the same JS of plus minus or separate.

Image is below of Review Cart & Checkout:

JS for Plus & Minus:

<script type="text/javascript">
function subtractQty(){
    if(document.getElementById("number").value - 1 < 0)
        return;
    else
    document.getElementById("number").value--;
    }
</script>

HTML/PHP for plus minus:

<div class="quantity">
<input style="font-size:21px;" type="button" value="-" onclick='javascript: subtractQty();' class="">
<input id="number" type="number" value="<?php echo $qtyT; ?>" class="qty" name="picpac">
<input style="font-size:21px;" type="button" value="+"  onclick='javascript: document.getElementById("number").value++;'  class="plus">
</div>

In jquery on change event again do function related to total amount or trigger total amount function. — priya_singh, Sep 29 '16 at 07:17
@madalinivascu yes can you please help me by proving the ajax? thanks — Fahad Almehaini, Sep 29 '16 at 07:21

dcalap · Answer 1 · 2016-09-29T16:05:35.033

1

You can follow two different strategies:

Invoke the server with an Ajax call, pass the quantity as parameter, calculate the total amount and return it.
Do all the operations in the front-end with jQuery and finally, pass the calculated value to store it.

In this link I have coded a quick example for the second one with your provided HTML. I just added a div for the calculated value

<div id="product1_total_price">0</div>

An input hidden for the product base price

<input type="hidden" id="product1_base_price" value="10">

And this jQuery code that do the magic:

$(document).ready(function() {

$(".operator").on('click',function() {
  $("#product1_total_price").text($("#product1_base_price").val()*$("#number").val());
 });
});

Hope it helps.

EDITED:

I add a (and update the JSFiddle link) suppossed Ajax call with jQuery, to update the DB on every quantity change:

$.ajax({
        type: "GET",
        data: {
            idProduct: yourProductId,
            quantity: $("#number").val(),
            totalPrice: calculatedValue
        },
        url: "your-script.php",
        success: function(json_response) {

          if(json_response.result != 'SUCCESS') {
              // Whatever
          } else {
              alert("Updated in DB");
          });
    })

edited Sep 29 '16 at 16:05

answered Sep 29 '16 at 13:43

dcalap

1,048
2
13
37

well your answer is working but i want to update in the database also automatically. Would you please help that also? – Fahad Almehaini Sep 29 '16 at 15:27
I've updated the JSFiddle link (https://jsfiddle.net/5moztzm1/2) with the supposed ajax call. You'll need to adapt it to your php script. Regards. – dcalap Sep 29 '16 at 15:57
i have tried, it is not updating.... this is my update script: `` – Fahad Almehaini Sep 29 '16 at 16:33
I 've never worked with PHP but note that you are using the $_POST and the ajax is GET, are you counting on this? – dcalap Sep 29 '16 at 16:44
yes counting but even i have tried the $_GET it is not working. – Fahad Almehaini Sep 29 '16 at 16:47
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/124570/discussion-between-dcalap-and-fahad-almehaini). – dcalap Sep 29 '16 at 17:06

how to update the price if quantity changed in cart

1 Answers1