更改数量时自动更新购物车数量

Question

在Magento的默认购物车中，当客户编辑数量时，他/她需要按下按钮来更新数量。

当用户在数量字段中输入其他数字时，购物车是否会自动更新数量？

Answer 1

首先编辑购物车模板 /app/design/frontend/{package}/{theme}/template/checkout/cart.phtml 并在表单元素上添加id，以便于访问。假设您添加'id="cart-form"';

现在编辑呈现购物车项目的模板:

• app/design/frontend/{package}/{theme}/template/checkout/cart/item/default。phtml,phtml
• app/design/frontend/{package}/{theme}/template/downloadable/checkout/cart/item/default。phtml,phtml

而在 <input> 具有名称的元素 cart[<?php echo $_item->getId() ?>][qty] 加上这个:

onchange="$('cart-form').submit()"

但我不建议这样做。这对用户来说真的很烦人。（至少对我来说）。

Answer 2

假设您的网站包含在无冲突模式中的jQuery，这是一种异步执行此操作的方式（更令人讨厌！）。

jQuery(document).ready(function(){
jQuery('#shopping-cart-table')
    .on(
        'change',
        'input[name$="[qty]"]',
        function(){
            var form = jQuery(jQuery(this).closest('form'));

            // we'll extract the action and method attributes out of the form

            // kick off an ajax request using the form's action and method,
            // with the form data as payload
            jQuery.ajax({
                url: form.attr('action'),
                method: form.attr('method'),
                data: form.serializeArray()
            });
        }
    );
});

.

我应该指出，这使得以下假设：

• 您的购物车住在一个元素内，其中ID 购物车 - 表
• 为数量的输入字段具有以 [qty] 结尾的名称属性

  应该很容易调整在线2和5的代码中的选择器，以匹配您的情况。

Answer 3

编辑这两个文件

app/design/frontend/{package}/{theme}/template/checkout/cart/item/default.phtml

app/design/frontend/{package}/{theme}/template/downloadable/checkout/cart/item/default.phtml

并在具有名称的元素上 cart[<?php echo $_item->getId() ?>][qty] 加上这个:

onchange="this.form.submit()"

Answer 4

如果您的jQuery版本旧，则不会成功。我找到了一种如下所示，随着我们的朋友Marius的说明来插入

/app/design/frontend/{package}/{theme}/template/checkout/cart.phtml并在表单元素上添加id以便更容易访问。假设您添加id="cart-form"

现在打开文件

app/design/frontend/{package}/{theme}/template/downloadable/checkout/cart/item/default.phtml

.

并滚动到文件的末尾，您将找到与数量增量和递减的JavaScript。该功能看起来像这样：

function plusQty(itemId){
    qty = $('qty'+itemId).value;
    qty = parseInt(qty);        
    qty++;
    $('qty'+itemId).value = qty;
}

function minusQty(itemId){
    qty = $('qty'+itemId).value;
    qty = parseInt(qty);        
    if(qty>0){
        qty--;
        $('qty'+itemId).value = qty;
    }
}

.

更改为此：

function plusQty(itemId){
    qty = $('qty'+itemId).value;
    qty = parseInt(qty);        
    qty++;
    $('qty'+itemId).value = qty;
    document.getElementById("cart-form").submit();  
}

function minusQty(itemId){
    qty = $('qty'+itemId).value;
    qty = parseInt(qty);

    if(qty>0){
        qty--;
        $('qty'+itemId).value = qty;
         document.getElementById("cart-form").submit();   
    }
}

.

Answer 5

如果你还没有加载jQuery，你也可以找到 <input> 元素（或在我的情况下a <select> 元素，因为我建立了一个下拉字段来选择金额）与名称 name="cart[<?php echo $_item->getId() ?>][qty]" 并添加此:

onchange="this.form.submit()"

您必须编辑的phtml文件位于此处:

app/design/frontend/{package}/{theme}/template/checkout/cart/item/default.phtml