PayPal结帐更新购物车总数后 ajax.



我有一个购物网站,我正在将其转换为Ajax。它有一个购物车项目列表。

在页面加载时,PayPal按钮设置正确,购物车总计传入。 但是,现在我有一个 Ajax 购物车,我需要在购物车更改时更新购物车总数。

如果我打电话给PayPal。按钮渲染功能再次我得到另一个按钮。

所以我需要删除旧按钮并重建或调用一些东西来更新总数。

谁能指出我正确的方向?

这是我设置按钮的代码。

function PayPalButton(authResult) {
// console.log(authResult);
// Render the PayPal button
paypal.Button.render({
// Set your environment
env: authResult.PayPalEnvironment, // sandbox | production
// Specify the style of the button
style: {
label: 'generic',
size: 'responsive',    // small | medium | large | responsive
shape: 'rect',     // pill | rect
color: 'blue',     // gold | blue | silver | black
tagline: false
},
// PayPal Client IDs - replace with your own
// Create a PayPal app: https://developer.paypal.com/developer/applications/create
client: {
sandbox: authResult.PayPalClientId,
production: authResult.PayPalClientId
},
payment: function (data, actions) {
// recover transaction value here
var carttotal = authResult.cart.FTotal - (authResult.VATApplies ? 0 : authResult.cart.VAT);
var paymentGuid = authResult.cart.PaymentGuid;
//alert(paymentGuid);
return actions.payment.create({
payment: {
transactions: [{
amount: {
total: carttotal.toString(), currency: 'GBP'
},
custom: paymentGuid.toString()
}]
}
});
},
onAuthorize: function (data, actions) {
return actions.payment.get().then(function (data) {
return actions.payment.execute().then(function () {
processPayPal(data);
});
});
}
}, '#paypal-button-container');
};

嗯,这有效,但它很丑陋。当然,一定有更好的方法。

更新购物车后。我从 DOM 中删除了 PayButton 按钮,并将 HTML 恢复原样。然后,我调用例程来重新配置按钮。

$("#PayPalSection").remove();
$("#paypalButtonContainer").append('<div id="PayPalSection"><div class= "col-8 offset-2"><div id="paypal-button-container"></div></div></div>');
ConfigurePayPalButton();

不幸的是,这需要往返数据库,但我会尝试编写不需要该步骤的内容。

最新更新