Paypal Button Not Working

year2021tcs
New Community Member

I had created a smart button via Paypal's Smart Payment Buttons. It generated the following code: 

 

<div id="smart-button-container">
<div style="text-align: center;">
<div style="margin-bottom: 1.25rem;">
<p>Yearbook Advertising Size</p>
<select id="item-options"><option value="Card Ad " price="120.00">Card Ad - 120.00 CAD</option><option value="1/4 Page Ad" price="230">1/4 Page Ad - 230 CAD</option><option value="1/2 Page Ad" price="430">1/2 Page Ad - 430 CAD</option><option value="Full Page Ad" price="750">Full Page Ad - 750 CAD</option></select>
<select style="visibility: hidden" id="quantitySelect"></select>
</div>
<div id="paypal-button-container"></div>
</div>
</div>
<script src="https://www.paypal.com/sdk/js?client-id=sb&currency=CAD" data-sdk-integration-source="button-factory"></script>
<script>
function initPayPalButton() {
var shipping = 0;
var itemOptions = document.querySelector("#smart-button-container #item-options");
var quantity = parseInt();
var quantitySelect = document.querySelector("#smart-button-container #quantitySelect");
if (!isNaN(quantity)) {
quantitySelect.style.visibility = "visible";
}
var orderDescription = 'Yearbook Advertising Size';
if(orderDescription === '') {
orderDescription = 'Item';
}
paypal.Buttons({
style: {
shape: 'pill',
color: 'blue',
layout: 'vertical',
label: 'paypal',

},
createOrder: function(data, actions) {
var selectedItemDescription = itemOptions.options[itemOptions.selectedIndex].value;
var selectedItemPrice = parseFloat(itemOptions.options[itemOptions.selectedIndex].getAttribute("price"));
var tax = (0 === 0) ? 0 : (selectedItemPrice * (parseFloat(0)/100));
if(quantitySelect.options.length > 0) {
quantity = parseInt(quantitySelect.options[quantitySelect.selectedIndex].value);
} else {
quantity = 1;
}

tax *= quantity;
tax = Math.round(tax * 100) / 100;
var priceTotal = quantity * selectedItemPrice + parseFloat(shipping) + tax;
priceTotal = Math.round(priceTotal * 100) / 100;
var itemTotalValue = Math.round((selectedItemPrice * quantity) * 100) / 100;

return actions.order.create({
purchase_units: [{
description: orderDescription,
amount: {
currency_code: 'CAD',
value: priceTotal,
breakdown: {
item_total: {
currency_code: 'CAD',
value: itemTotalValue,
},
shipping: {
currency_code: 'CAD',
value: shipping,
},
tax_total: {
currency_code: 'CAD',
value: tax,
}
}
},
items: [{
name: selectedItemDescription,
unit_amount: {
currency_code: 'CAD',
value: selectedItemPrice,
},
quantity: quantity
}]
}]
});
},
onApprove: function(data, actions) {
return actions.order.capture().then(function(details) {
alert('Transaction completed by ' + details.payer.name.given_name + '!');
});
},
onError: function(err) {
console.log(err);
},
}).render('#paypal-button-container');
}
initPayPalButton();
</script>

 

My customers can see the button and enter their information but everytime they click Pay Now it cycles them back to the original page and does not process their information. 

 

Please help!

 

 

 

Login to Me Too
0 REPLIES 0

Haven't Found your Answer?

It happens. Hit the "Login to Ask the community" button to create a question for the PayPal community.