2017-02-26 95 views
0

我正在更改用戶Shopify購物車與Ajax,購物車正在成功更改,但爲了顯示更新購物車用戶必須刷新頁面。我想在不刷新的情況下顯示購物車更改。更新Shopify購物車與ajax沒有頁面刷新

我使用AJAX API就好了,我可以添加和刪除與項目:

Shopify.addItem(); 
Shopify.removeItem(); 

這些工作的偉大,但他們需要用戶重新加載頁面才能看到新/更改的項目在他們的購物車。你知道一種方法來顯示更新的購物車沒有頁面重新加載嗎?

所以每個人都有完整的圖片,這裏是我的代碼:

function poll(products) { 
$.ajax({ 
    url: "/apps/proxy", 
    data: {products: products}, 
    type: "GET", 
    dataType: "json", 
    complete: setTimeout(function() 
     {cartAdd(); poll(products)}, 15000), 
    success: function(data) { 
     $.each(data, function(incoming_key, incoming_value){ 
     Shopify.getCart(function(cart){ 
      $.each(cart.items, function(cart_key, cart_value){ 
      if(cart_value.variant_id == incoming_value.id_to_remove){     
       Shopify.addItem(incoming_value.variant_id, incoming_value.quantity); 
       Shopify.removeItem(incoming_value.id_to_remove); 
       console.log("some reason the incoming id is null or maybe not " + incoming_value.variant_id); 
      } 
      else if(cart_value.variant_id == incoming_value.variant_id && cart_value.quantity != incoming_value.quantity){ 
       Shopify.changeItem(cart_value.variant_id, incoming_value.quantity); 
      } 
      }); 
     }); 
     }); 
    }, 
}); 
} 

回答

1

做對/cart購物車頁面Ajax調用,獲得所需要的元素,並取代它們在當前頁面上。

在第一個$.each函數之後添加上面的代碼。