volusion 中的 Ajaxify 购物车

Question

我正在开发 Volusion 上的模板，我的问题是，“添加到购物车”按钮可以ajaxified 吗？

<div id="custom-buttons">
<div id="custom-cart">
    <a href="ShoppingCart.asp">
    <input class="vCSS_input_addtocart" type="image"
    src="/v/vspfiles/templates/248/images/buttons/btn_addtocart.gif" 
    name="btnaddtocart" alt="Add to cart" border="0" 
    data-image-path="/v/vspfiles/templates/248/images/buttons/btn_addtocart.gif"/>
</a>
</div>

这就是代码，按钮本身可以工作，但它会将我从产品页面带到购物车页面，我想避免这种情况，但仍将所需的商品添加到购物车。

谢谢！

Answer 1

假设您的商店启用了管理配置变量“启用添加到购物车弹出窗口”，您只需在模板中的任何位置提供如下所示的链接，当用户单击它时，它将通过 Ajax 添加项目，所以只要该项目没有选项或不是礼券。 Volusion 内置了脚本，如果打开了配置变量，这些脚本会自动处理这个问题。

<a class="unbind" href="/ShoppingCart.asp?ProductCode=xyz">
   <img border="0" align="absmiddle" src="/v/vspfiles/templates/248/images/buttons/btn_addtocart_small.gif">
</a>

将以下内容添加到模板中</head> 标记之前，并使用上面的链接添加项目。每次您点击它时，它都会在购物车中添加一个数量。根据您的请求，不会有任何视觉反馈表明该项目已添加。

<script type="text/javascript">
$(function() {
$('.unbind').unbind()
    .click(function() {
        var product_code = $(this).attr('href').substr($(this).attr('href').lastIndexOf('=') + 1).toUpperCase();
        $.ajax({
            type: "POST",
            url: '/ProductDetails.asp?ProductCode=' + product_code + '&btnaddtocart=btnaddtocart&AjaxError=Y&batchadd=Y',
            data: 'ProductCode=' + product_code + '&QTY.' + product_code + '=1'
        });
        return false;
    });
});
</script>

如果您希望在单击商品后弹出软购物车，请使用上面显示的 HTML（相应地更改产品代码）并使用以下代码。

<script type="text/javascript">
$(function() {
    $('.unbind').unbind()
        .click(function() {
            var qstr = 'ProductCode=' + global_URL_Encode_Current_ProductCode + '&QTY.' + global_URL_Encode_Current_ProductCode + '=1&ReplaceCartID=&ReturnTo=&e=&btnaddtocart.x=5&btnaddtocart.y=5';
            SoftAddSingleItem(global_URL_Encode_Current_ProductCode, 1, qstr);
            return false;
        });
});
</script>