Woocommerce 中的迷你购物车数量变化答案

【问题标题】：Mini cart quantity change in WoocommerceWoocommerce 中的迷你购物车数量变化
【发布时间】：2014-10-30 02:27:55
【问题描述】：

我已经阅读了有关 woocommerce 的每一个主题，但不知道如何在 Woocommerce MiniCart 中添加一个减号按钮来减少购物车项目的数量（最好使用 ajax）。

我确实设法添加了一个按钮，该按钮使用 woocommerce 短代码和其他几个代码示例来增加数量。但是，我找不到如何减少任何地方的数量。

关于这个有多个问题，没有答案。或者我在错误的目录中搜索。

但是，有人可以给我一个代码示例，说明如何减少开箱即用产品的购物车数量吗？我已经用这些代码行尝试了一个自定义 php 文件：

$cartKey = $_POST['cart_item_key']; //The cart key required by set_quantity method
$cartQty = $_POST['cart_item_qty']; //the quantity I provide in my post

global $woocommerce;
echo $woocommerce->cart->set_quantity($cartKey,$cartQty);

但是通过 AJAX 帖子调用它会给我一个错误（内部服务器错误）。我也尝试以负数添加到购物车，也没有工作。

更新：将此代码添加到 WP 页面模板并调用该页面不再给我错误。但是，调用代码后，它不会更新购物车。

我能做什么？非常感谢，希望有人能在这里提供帮助！

【问题讨论】：

标签： php jquery ajax wordpress woocommerce

【解决方案1】：

好的，所以我想通了。我做了什么：

1：创建一个负责处理AJAX更新购物车的WP页面。我认为你也可以只用一个简单的 PHP 文件来做到这一点，但我现在只是创建了一个自定义 WP 模板。所以我添加了一个名为“template-setquantity.php”的页面模板，其内容如下：

    <?php   
    /**
    * Template Name: Request template for Set Quantity
    * This page updates mini cart quantity for a product based on the post value
    */
    //I dont think this line is needed
    global $woo_options;
    ?>
    <html>
    <head>
     <?php wp_head(); ?>
    </head>
    <body>
     //the cart key stores information about cart
     $cartKeySanitized = filter_var($_POST['cart_item_key'], FILTER_SANITIZE_STRING);
     //the new qty you want for the product in cart
     $cartQtySanitized = filter_var($_POST['cart_item_qty'], FILTER_SANITIZE_STRING);  
     //update the quantity
     global $woocommerce;
     ob_start();
     $woocommerce->cart->set_quantity($cartKeySanitized,$cartQtySanitized); 
     ob_get_clean();
     wp_footer(); ?>
     <?php woo_foot(); ?>
    </body>
    </html>

使用此模板创建一个 wordpress 后端页面。对于本教程，网址应为：updatecart
现在将 mini-cart.php 从 woocommerce 复制到您的自定义主题。所以我在自定义主题中创建了目录 woocommerce/cart 并将文件 mini-cart.php 复制到此文件夹中

更新 mini-cart.php 模板以添加您的加号和减号按钮以更新迷你购物车中的数量。对我来说，这意味着在每个产品的循环中某处添加以下代码：

<?php
//btn add
echo do_shortcode('[add_to_cart id="'.$cart_item['product_id'].'" show_price="false" btn_text="+" class="btnAdd" ]');
//btn minus, the cart_item_key and $cart_item['.. is available already in scope.
echo '<a class="btnMinus" onClick="updateQty(\''.$cart_item_key.'\','.($cart_item['quantity']-1).')"> - </a>';
?>

所以现在我们已经设置了捕获更新数量请求的页面，并且我们已经为迷你购物车中的每个产品添加了加号和减号按钮。作为最后一步，我们需要创建一个 JS 函数，它做两件事：AJAX 调用我们的 updatecart 模板页面和 AJAX 调用以直观地刷新购物车内容1。

在我的例子中，我将这些函数添加到页脚。正如您在第 4 步中所读到的，onClick 的减号按钮的功能是 updateQty，因此它必须是我们的 JS 函数名称。将以下 JS 代码粘贴到例如您的页脚（请注意我使用 Jquery）：

<script type="text/javascript">
function updateQty(key,qty){
 url = 'http://yourdomain.com/updatecart/';
 data = "cart_item_key="+key+"&cart_item_qty="+qty;

 jQuery.post( url, data ) .done(function( data ) {
  //function updateCartFragment 
  updateCartFragment();
 });
}

function updateCartFragment() {
 $fragment_refresh = {
  url: woocommerce_params.ajax_url,
  type: 'POST',
  data: { action: 'woocommerce_get_refreshed_fragments' },
  success: function( data ) {
    if ( data && data.fragments ) {          
        jQuery.each( data.fragments, function( key, value ) {
            jQuery(key).replaceWith(value);
        });

        if ( $supports_html5_storage ) {
            sessionStorage.setItem( "wc_fragments", JSON.stringify( data.fragments ) );
            sessionStorage.setItem( "wc_cart_hash", data.cart_hash );
        }                
        jQuery('body').trigger( 'wc_fragments_refreshed' );
    }
  }
 };

 //Always perform fragment refresh
 jQuery.ajax( $fragment_refresh );  
}
</script>

我希望这会有所帮助！

注意，在以后的 Woocommerce 版本中，我最好用函数 WC() (http://docs.woothemes.com/wc-apidocs/function-WC.html) 替换全局 $woocommerce

【讨论】：

感谢您分享此解决方案！我无法启动并运行它，您介意分享更多代码示例，例如如何进行 AJAX 调用吗？我希望我可以 pm 你，但没有与你的个人资料相关联的联系信息。提前致谢！干杯，杰伦。
非常感谢！它是一种魅力。为了使其工作，我必须从您的示例中修改一件事是更改 $woocommerce->cart->set_quantity() 函数以匹配分配的变量。（Sani -> 已消毒）。再次感谢您提供明确的答案和示例！干杯
酷，不客气！你对变量的看法是对的，我编辑了我的答案。
嗨，最新版本的 Woocommerce 有没有更简单的解决方案？
@Marcel，模板正文部分缺少起始标记“