Question

我正在处理的WooCommerce商店需要在数量更改后更新购物车页面。此外，默认情况下，它不能作为存在的更新购物车按钮。关于它是如何做的任何想法，可能使用AJAX或任何其他线索？

任何帮助都会很棒！目前我们的网页购物车与http://www.shoopclothing.com类似，例如http://www.shoescribe.com/。

到目前为止我已尝试过：

尝试搜索更新购物车方法本身，但无法找到更改购物车小计的确切内容。
也尝试使用AJAX再次打印出页面而不重新加载。这只是重新加载整页但数量仍然相同

这是我们尝试的脚本：

 $(".product-order").on("click", "span.add", function () {
        var form = $(this).closest('form').serialize();
        $.ajax({
          type: "POST",
          url: "update_cart url",
          data: form
        }).done(function( msg ) {
            console.log(msg);
            alert("Data Saved: " + msg);
        });
  });

Answer 1

嘿，如果还不算太晚，这里有一个快速解决方案，可以更新您的购物车而无需用户点击“更新购物车”按钮。它不是AJAX，但它是一种简单的方法来完成它。

基本上，如果用户更改任何项目的数量，则一旦用户退出产品数量td，购物车就会更新。它使用.trigger（）jQuery事件处理程序自动提交表单。

只需使用此jQuery代码：

jQuery(document).ready(function() {
    var itemQtyInitial;

    jQuery('.woocommerce table.cart tr.cart_item .product-quantity').hover(function() {
        itemQtyInitial = jQuery('.qty', this).val();
    }, function() {
        var itemQtyExit = jQuery('.qty', this).val();

        if(itemQtyInitial != itemQtyExit) {
            jQuery(".button[name='update_cart']").trigger("click");
        }
    });

});

然后你可以用这个CSS隐藏“更新购物车”按钮：

.woocommerce table.cart td.actions input[name="update_cart"] {
    display: none;
}

这应该有用！

Answer 2

Thanks to Niko. I made little change to his code snippet. It now should works well even with ajax of woocommerce. And the cart will be updated automatically after user click "+" or "-".

$('body').on('click','table.cart .quantity',function(){
    var itemQtyInitial;

    jQuery('.woocommerce table.cart tr.cart_item .product-quantity').hover(function() {
        itemQtyInitial = jQuery('.qty', this).val();
        console.log("inital",itemQtyInitial);
    }, function() {
        var itemQtyExit = jQuery('.qty', this).val();
        console.log("change",itemQtyExit);
        if(itemQtyInitial != itemQtyExit) {
            jQuery(".button[name='update_cart']").trigger("click");
        }
    });
});

Answer 3

您的问题是您将SERIALIZED数据发送到更新购物车功能，因此它无法识别发布数据，您必须在jquery中发布所有输入字段

WooCommerce购物车页面需要在没有更新购物车按钮的情况下更新

3 个答案: