WooCommerce购物车页面需要更新，无需更新购物车按钮

问题描述：

我正在使用的WooCommerce商店需要在更改数量后更新购物车页面。另外，默认情况下它不能具有更新购物车按钮。任何想法如何，可能与AJAX或任何其他线索？WooCommerce购物车页面需要更新，无需更新购物车按钮

任何帮助将是太棒了！目前我们网页的购物车类似于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); 
     }); 
    });

分享你的研究可以帮助每个人。告诉我们你试过了什么，以及它为什么不符合你的需求。这表明你已经花时间去尝试帮助自己，它使我们避免重申明显的答案，最重要的是它可以帮助你得到更具体和相关的答案！另请参阅[如何问]（http://stackoverflow.com/help/how-to-ask） – 2014-11-04 12:57:08

已添加更多信息，希望对您有所帮助 – Dave 2014-11-04 13:39:04

答

你的问题是，你发送的序列化数据来更新车的功能，所以它不能识别发布数据，你必须把你所有的输入字段放在你的jquery帖子中

答

嘿，如果还不算太晚，这里有一个快速的解决方案，可以更新你的购物车，而无需点击“更新购物车“按钮。这不是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; 
}

这应该工作！

这样做可以让工作完成，直到我们有更多时间实施更好的实时更新而无需刷新页面。 Woocommerce是否实施了任何方式来做到这一点，而不需要深入研究代码？我还没有找到内置的解决方案。 – Josh 2016-05-17 19:14:20

答

感谢Niko。我对他的代码片段做了一点改动。它现在应该运行良好，即使与woocommerce阿贾克斯。用户点击“+”或“ - ”后，购物车将自动更新。

$('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"); 
     } 
    }); 
});

WooCommerce购物车页面需要更新，无需更新购物车按钮

相关推荐