Shopify 使用 AJAX 更新 cart.item_count
2013-06-30
6235
在我的
Shopify
网站的产品详细信息页面上,当您单击“
添加到购物车
”时,该页面使用
AJAX
来执行其操作。但是有一个名为
cart.item_count
的变量,除非页面刷新,否则不会更新。
问题:
如何让 AJAX 更新该页面上的
cart.item_count
。
以下是 HTML 页面的代码:
<div id="mini-cart" >
<span class="cart_count_info">Cart ({{ cart.item_count }})</span>//THIS SPAN IS WHAT NEEDS TO BE UPDATED
</div>
<p id="add-to-cart-msg"></p> //THIS "P" IS UPDATED BY THE AJAX WITH MESSAGING SEE BELOW JAVASCRIPT
<form action="/cart/add" method="post" class="variants" id="product-actions" enctype="multipart/form-data">
//TOOK OUT SOME OF THE FORM DATA THAT IS NOT NEED FOR THIS EXAMPLE
</form>
JavaScript 代码。
底部有一行代码可更新同一页面上的一些副本...如果我可以更新已在页面上找到的
cart.item_count
变量。
function addToCartSuccess (jqXHR, textStatus, errorThrown){
$.ajax({
type: 'GET',
url: '/cart.js',
async: false,
cache: false,
dataType: 'json',
success: updateCartDesc
});
$('#add-to-cart-msg').hide().addClass('success').html('Item added to cart! <a href="/cart" title="view cart">View cart and check out »</a>').fadeIn();
$('span#cart_count_info').load(Cart ({{ cart.item_count }}));
//MAYBE HERE IS WHERE I CAN ADD MY CODE TO UPDATE THE VARIABLE I NEED. MY CODE IS JUST A GUESS SINCE ID DON'T DO MUCH JAVASCRIPT PROGRAMMING.
}
2个回答
删除
$('span#cart_count_info').load(Cart ({{ cart.item_count }}));
并将其替换为下面的“UpdateCartDesc”函数(请参阅成功消息)
function updateCartDesc(data){
var $cartLinkText = $('.cart_count_info').html(data.item_count);
}
Gerson Mejia
2013-08-23
由于它与标题相关,当您单击“添加到购物车”时,您会获得购物车中更新的产品数量。
只需将类
cart-count
添加到 div。您的结构应如下所示:
#pageheader > .cart-summary > .cart-count
Veer En
2014-10-10