Shopify 게시물 Ajax 장바구니에 추가 성공 메시지 장바구니 페이지

Question

Shopify를 사용하여 온라인 상점을 만들고 기본 서식 파일에 jQuery/Ajax 코드를 몇 가지 발견했습니다.

function addToCartSuccess (jqXHR, textStatus, errorThrown){ 

    $.ajax({ 
    type: 'GET', 
    url: '/cart.js', 
    async: false, 
    cache: false, 
    dataType: 'json', 
    success: updateCartDesc 
    }); 
    window.location = "/cart"; 
    $('.add-cart-msg').hide().addClass('success').html('Item added to cart! <a href="/cart" title="view cart">View cart and check out &raquo;</a>').fadeIn('300'); 
} 

장바구니 페이지에 메시지를 게시 할 수는 있지만 실제로는 사용할 수 없다고 생각하는 window.location 행을 추가했습니다. 해당 코드를 제거하면 장바구니에 추가 버튼을 누르면 성공 메시지가 제품 페이지에 게시되므로 수정없이 실제 작업이 수행됩니다.

나는 또한 POST 명령을 내 자신의 함수를 만드는 시도했지만 나는 내가 어디에 jQuery를/아약스

function updateCartDesc (jqXHR, textStatus, errorThrown){ 

    $.ajax({ 
    type: 'POST', 
    url: '/cart', 
    async: false, 
    cache: false, 
    dataType: 'html', 
    success: function(){('.add-cart-msg').hide().addClass('success').html('Item added to cart! <a href="/cart" title="view cart">View cart and check out &raquo;</a>').fadeIn('300'); 
    } 
}); 

모든 포인터의 수준과 이전의 경험이 없기 때문에 정말 최고의 추측하고있다 잘못되어가는? 튜토리얼, 가이드 등이 훌륭합니다. 감사합니다.

Answer 1

사용자는 장바구니 페이지에 메시지를 표시하는 URL에 매개 변수가있는 장바구니 페이지로 사용자를 리디렉션해야합니다. 아래의 식으로 뭔가 :

귀하의 아약스 장바구니 페이지에서 장바구니에 호출 및 콜백

$.ajax({ 
    type: 'GET', 
    url: '/cart.js', 
    async: false, 
    cache: false, 
    dataType: 'json', 
    success: updateCartDesc 
}); 

var updateCartDesc = function() { 
    //redirect the user to the cart and pass showSuccess=true in the URL 
    window.location = "/cart?showSuccess=true"; 
}; 

스크립트에 추가

$(function() { 
    //if the current URL contains showSuccess, 
    //display the success message to the user 
    if(window.location.href.indexOf('showSuccess') != -1) { 
     $('.add-cart-msg').hide() 
          .addClass('success') 
          .html('Item added to cart!') 
          .fadeIn('300'); 

    } 
}); 

그냥이 코드는 당신이이 가정 점에 유의하기 요소는/cart 페이지의 add-cart-msg 클래스에 있습니다.