Jquery加入购物车

Question

我想创建马卡龙电子商务网站，用户为固定的盒子选择马卡龙（比如1个盒子意味着10个马卡龙）并将它们添加到购物车中。因此，方案是，通过单击左侧面板中的产品（参见屏幕截图SS1.png），相同的产品将出现在框中，依此类推。我已经通过JQuery完成了必要的工作并且工作正常。

当用户在框中填写所需的马卡龙并单击“添加到购物车”按钮时，产品将作为“设置/组”添加到购物车中。所以购物车看起来像第二个屏幕截图 - SS2.png。你能告诉我如何将产品添加到购物车中吗？该网站使用PHP和MySQL。

屏幕截图如下：

等待您的回复。

Answer 1

在我看来，您正在寻找AJAX功能

您可以编写如下代码： 我假设所选项目显示在具有某种独特Ids

的div中

$(document).ready(function() {
    $('#addtocartbutton').click(function() {
        // here you can loop through the div or something to get the selected items
           var quantities = {};  //creating an empty string to store the productids and quantities selected
       $('selecteditemsdiv').each(function(){
          var itemid = $(this).data('id');//get the item id assuming it is stored in the data-* attributes
          var qty = $(this).data('qty'); //get the quantity if you have stored it in data-* attributes
        just push it in the json string
           quantities['itemid'] = qty;

        });
        $.ajax({
            url: "cart.php",
            type: "POST",
            data: {datainfo: quantities}, //pass the json string to php
            success: function(data) {
                // Do stuff when the AJAX call returns
            }
        });
    });
});