在 Shopify Collections 中添加添加到购物车按钮

Question

此帖子已隐藏。 它在 1 小时前被 Cody Gray♦ 删除。 关闭。 此问题不符合 Stack Overflow 准则。 它目前不接受答案。 这个问题似乎与帮助中心定义的 scope 中的编程无关。

1 小时前关闭。

（私信给你）

我对 ENVY 模板有疑问。 此模板不支持在位于家中的 collections 中添加购物车按钮。 在此之前，我决定在显示这些产品的区域添加我自己的代码，但是当按下按钮添加到购物车时，它会将我发送到错误页面，并显示消息“参数丢失或无效：所需参数丢失或无效：项目”我的代码如下：

 function instantBuy(){
     var $ = jQuery;

   var formParams = $('form.cart').serialize();
     $.ajax({
      url: "/cart/add",
      type: "post",
      data: formParams,
      success: function(){ 
       window.location.href = "/checkout";
      },
      error: function(){
      }
     })
 }

表格代码

<form action="/cart/add" method="post" class="variants" id="product-actions-{{ product.id }}" enctype="multipart/form-data">
<input type="hidden" name="variantId" value="{{ product.variants[0].id }}" />
<button class="button buynow-btn" title="Buy" onClick="instantBuy()"><span>Buy now</span></button>
</form>

Answer 1

当您向 /cart/add 发送请求时，必须发送“id”arguments。 目前您发送的是“variantId”而不是“id”。

同样在您的 JavaScript 中，没有 preventDefault 来保护浏览器发送请求。

另一方面，这可以在没有 JavaScript 的情况下完成。

这是更新的代码：

<form action="/cart/add" method="post" class="variants" id="product-actions-{{ product.id }}" enctype="multipart/form-data">
<input type="hidden" name="id" value="{{ product.variants[0].id }}" />
<input type="hidden" name="return_to" value="/checkout" />
<button class="button buynow-btn" title="Buy" onClick="instantBuy()"><span>Buy now</span></button>
</form>

还添加了一个“return_to”隐藏字段，当用户点击按钮时，它将直接重定向到结帐