Question

我读过关于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页面模板并调用该页面不再给我错误。但是，在调用代码后，它不会更新购物车。

我该怎么办？非常感谢，我希望有人可以在这里提供帮助！

Answer 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后端页面。对于本教程，URL应为：updatecart
现在将mini-cart.php从woocommerce复制到您的自定义主题。所以我在我的自定义主题中创建了dir 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

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

1 个答案: