#3 Shopping Cart With Checkout System Using Bootstrap 4, PHP, MySQLi & Ajax | Adding Product to Cart



https://i.ytimg.com/vi/9a5wRuSvJWQ/hqdefault.jpg



Hello friends! In this video tutorial series you will learn how to make a shopping cart with checkout system using Bootstarp 4, PHP, MySQLi (Prepared Statement OOP) and jQuery Ajax.

This is the 3rd video of this series in which I’m showing you how to add product in cart when we click on add to cart button. And I’m also showing you how to update cart counter number dynamically using Ajax and PHP.

Source Code : https://dcodemania.com/post/shopping-cart-with-checkout-system-php-mysqli-ajax

Full Playlist of this project : https://www.youtube.com/playlist?list=PL6u82dzQtlfsQoq15__a6oRLLwvkhGu43

#shoping_cart_php_ajax
#cart_system_php_mysqli
#checkout_system_php_mysqli

If you like my works and my video tutorials then you can donate me some amount. You can donate through these links :

Paypal : https://www.paypal.me/wolfmania

Instamojo (Credit/Debit Card & UPI) : https://www.instamojo.com/@wolfmania

Thanks for watching this video. If you like this video then hit like button, share this video, And Subscribe my Channel. Also like my Facebook page for latest updates.

♥ Facebook Page – https://www.facebook.com/dcodemania
♥ Myself On FB – https://www.facebook.com/sahil4rock
♥ Instagram – https://www.instagram.com/sahil4rock
♥ Twitter – https://twitter.com/dcodemania

Original source


50 responses to “#3 Shopping Cart With Checkout System Using Bootstrap 4, PHP, MySQLi & Ajax | Adding Product to Cart”

  1. Problem found: product_code on table cart the are not unique number appear but characters value <br /><b> others data are correct. Here is result :
    Huawei10 pro
    75000 image/huawei_mate10_pro.jpg 1 75000 <br /><b>
    Problem has been solved. Thanks a lot of.

  2. Sir when I clicked on Add to cart button product does not added to cart or database or cart number I type code 10times as you type in video so sir plz provide source code of tutorial & help your subscriber

  3. Man, your code isn't working! I'm not able to enter the data into the database! Nothing happens when i click the add to cart button! I watched the video 3 times and typed the code 3 times, but nothing happens

  4. I have watched this video 3 -4 times and went through both action.php and index.php but I can't seem to get it to add to the cart database after clicking add to cart button. this my line of code, as well I am not getting a return message for success or not item has been added. Please get back to me
    from Action.php
    <?php

    require 'config.php';

    if(isset($_post['pid'])){

    $pid = $_POST['pid'];

    $pname = $_POST['pname'];

    $pprice = $_POST['pprice'];

    $pcode = $_POST['pcode'];

    $pqty = $_POST['pqty'];

    $pcolour = $_POST['pcolour'];

    $pdis = $_POST['pdis'];

    $pimage = $_POST['pimage'];

    $QTY = 1;

    $stmt = $conn->prepare("SELECT Product_Code FROM cart WHERE Product_Code=?");

    $stmt->bind_param("s",$pcode);

    $stmt->execute();

    $res = $stmt->get_result();

    $r = $res->fetch_assoc();

    $code = $r['Product_Code'];

    if(!$code){

    $query = $conn->prepare(" INSERT INTO cart (Product_Code,Product_Colour,Product_Name,Product_Price,QTY,Total_Price,Product_Image) VALUES (?,?,?,?,?,?,?)");

    $query->bind_param("ssssiss",$pcode,$pcolour,$pname,$pprice,$pqty,$pprice, $pimage);

    $query->execute();

    echo '<div class="alert alert-success alert-dismissible">

    <button type="button" class="close" data-dismiss="alert">&times;</button>

    <strong>The selected Item has been added </strong>

    </div>';

    }

    else{

    echo '<div class="alert alert-danger alert-dismissible">

    <button type="button" class="close" data-dismiss="alert">&times;</button>

    <strong>The selected Item has been already added </strong>

    </div>';

    }

    }

    ?>

    from index.php
    <div class="container">

    <div id="message"></div>

    <div class="row mt-2 pb-3">

    <?php

    include'config.php';

    $stmt = $conn->prepare("SELECT * FROM product");

    $stmt->execute();

    $result = $stmt->get_result();

    while($row = $result->fetch_assoc()):

    ?>

    <div class="col-sm-6 col-md-4 col-lg-3 mb-2">

    <div>

    <font class="SmallB">Product code:</font>

    <font class="italic"><?= $row['Product_Code']?></font>

    </div>

    <div class="card-deck">

    <div class="card p-2 border-secondary md-2">

    <img src="<?= $row['Product_Image'] ?>" class="card-img-top" height="250px">

    <div class="card-body p-1">

    <h4 class="card-title text-center text-info"><?= $row['Product_Name']?></h4>

    <p class="para">

    <?= $row['Product_Description']?>

    </p>

    <h5 class="card-text text-center text-danger">

    PRICE <i class='fas fa-dollar-sign'

    style='font-size:15px'></i><?= number_format($row['Product_Price'],2)?>

    <BR>

    <font class="QTY">

    Quanity available is <?= $row['Product_QTY']?> </font>

    </h5>

    </div>

    <div class="card-footer p-1">

    <form action="" class="form-submit">

    <input type="hidden" class="pid" id="pid" value="<?= $row['ID']?>">

    <input type="hidden" class="pname" id="pname" value="<?= $row['Product_Name']?>">

    <input type="hidden" class="pprice" value="<?= $row['Product_Price']?>">

    <input type="hidden" class="pcode" value="<?= $row['Product_Code']?>">

    <input type="hidden" class="qty" value="<?= $row['Product_QTY']?>">

    <input type="hidden" class="pcolour" value="<?= $row['Product_Colour']?>">

    <input type="hidden" class="pdis" value="<?= $row['Product_Description']?>">

    <button class="btn btn-info btn-block addItemBtn"><i class="fas

    fa-cart-plus"></i>&nbsp; Add to Cart</button>

    </form>

    </div>

    </div>

    </div>

    </div>

    <?php endwhile; ?>

    </div>

    </div>

    <!– jQuery library –>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script&gt;

    <!– Popper JS –>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script&gt;

    <!– Latest compiled JavaScript –>

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script&gt;

    <script type="text/javascript">

    $(document).ready(function(){

    $(".addItemBtn").click(function(e){

    e.preventDefault();

    var $form = $(this).closest(".form-submit");

    var pid =$form.find(".pid").val();

    var pname =$form.find(".pname").val();

    var pprice =$form.find(".pprice").val();

    var pcode =$form.find(".pcode").val();

    var pqty =$form.find(".pqty").val();

    var pcolour =$form.find(".pcolour").val();

    $.ajax({

    url: 'action.php',

    method: 'post',

    data: {pid:pid,pname:pname,pprice:pprice,pcode:pcode,pqty:pqty,pcolour:pcolour},

    success:function(response){

    $("#message").html(response);

    }

    });

    });

    });

    </script>

    </body>

    </html>

  5. Hi
    I did check 3 times to all the code in index.php and action.php for add to cart product(in cart symbol) but i cant see in cart no product but its showing in database and all message are correct too.
    how can I solve the problem?i need to submit my assignment this sunday.it will be really helpful if you can figure out somthing.

    Thank you

  6. I have a question, why is my code not executing from $(document).ready(function() down to the end of </html>, when I run the file there are pictures and button but bellow that is just this code written on the page.
    Could you help please?

  7. Notice: Trying to access array offset on value of type null in C:xampphtdocsmmtutsphpaction.php on line 17

    Fatal error: Uncaught Error: Call to a member function bind_param() on bool in C:xampphtdocsmmtutsphpaction.php:22 Stack trace: #0 {main} thrown in C:xampphtdocsmmtutsphpaction.php on line 22
    your code generate thiese error bro……

  8. I keep getting a notice saying Trying to access array offset on value of type null in C:xampphtdocsproject1action.php on line 21 , whenever I added an item to cart. The item will still get added to cart and database but I still get the notice, did anyone else have this problem?

  9. sir , i press add to cart button, it didnt insert into my database and not show thwe successfully massage and danger massage , my code is alredy 4 time checking i'm not code mistake so please sir your source code give me …..sazzadahmed109@gmail.com

Leave a Reply