Error when using code for Smart Paypal Button

mert3406
Contributor
Contributor

I am getting the below error when pasting the code for the Paypal Smart Button Form into my Invoicing Message Body.  Any thoughts as to what is causing this?  Below this error, I've also pasted the code I am using.

 

Uncaught ReferenceError: paypal is not defined
https://merhaut.com/web?debug#id=47998&view_type=form&model=account.invoice&action=210&menu_id=110:25
Traceback:
ReferenceError: paypal is not defined
    at initPayPalButton (eval at <anonymous> (https://merhaut.com/web/content/388489-96c0ca6/web.assets_common.js:370:213), <anonymous>:25:5)
    at eval (eval at <anonymous> (https://merhaut.com/web/content/388489-96c0ca6/web.assets_common.js:370:213), <anonymous>:97:3)
    at eval (<anonymous>)
    at https://merhaut.com/web/content/388489-96c0ca6/web.assets_common.js:370:213
    at Function.globalEval (https://merhaut.com/web/content/388489-96c0ca6/web.assets_common.js:370:233)
    at jQuery.fn.init.domManip (https://merhaut.com/web/content/388489-96c0ca6/web.assets_common.js:730:306)
    at jQuery.fn.init.append (https://merhaut.com/web/content/388489-96c0ca6/web.assets_common.js:716:295)
    at jQuery.fn.init.<anonymous> (https://merhaut.com/web/content/388489-96c0ca6/web.assets_common.js:725:23)
    at jQuery.access (https://merhaut.com/web/content/388489-96c0ca6/web.assets_common.js:599:21)
    at jQuery.fn.init.html (https://merhaut.com/web/content/388489-96c0ca6/web.assets_common.js:722:309)

 <div id="smart-button-container"> <div style="text-align: center"><label for="description">Invoice Number </label><input type="text" name="descriptionInput" id="description" maxlength="127" value=""></div> <p id="descriptionError" style="visibility: hidden; color:red; text-align: center;">Please enter a description</p> <div style="text-align: center"><label for="amount">Payment Amount </label><input name="amountInput" type="number" id="amount" value="" ><span> USD</span></div> <p id="priceLabelError" style="visibility: hidden; color:red; text-align: center;">Please enter a price</p> <div id="invoiceidDiv" style="text-align: center; display: none;"><label for="invoiceid"> </label><input name="invoiceid" maxlength="127" type="text" id="invoiceid" value="" ></div> <p id="invoiceidError" style="visibility: hidden; color:red; text-align: center;">Please enter an Invoice ID</p> <div style="text-align: center; margin-top: 0.625rem;" id="paypal-button-container"></div> </div> <script src="https://www.paypal.com/sdk/js?client-id=sb&currency=USD" data-sdk-integration-source="button-factory"></script> <script> function initPayPalButton() { var description = document.querySelector('#smart-button-container #description'); var amount = document.querySelector('#smart-button-container #amount'); var descriptionError = document.querySelector('#smart-button-container #descriptionError'); var priceError = document.querySelector('#smart-button-container #priceLabelError'); var invoiceid = document.querySelector('#smart-button-container #invoiceid'); var invoiceidError = document.querySelector('#smart-button-container #invoiceidError'); var invoiceidDiv = document.querySelector('#smart-button-container #invoiceidDiv'); var elArr = [description, amount]; if (invoiceidDiv.firstChild.innerHTML.length > 1) { invoiceidDiv.style.display = "block"; } var purchase_units = []; purchase_units[0] = {}; purchase_units[0].amount = {}; function validate(event) { return event.value.length > 0; } paypal.Buttons({ style: { color: 'gold', shape: 'rect', label: 'paypal', layout: 'vertical', }, onInit: function (data, actions) { actions.disable(); if(invoiceidDiv.style.display === "block") { elArr.push(invoiceid); } elArr.forEach(function (item) { item.addEventListener('keyup', function (event) { var result = elArr.every(validate); if (result) { actions.enable(); } else { actions.disable(); } }); }); }, onClick: function () { if (description.value.length < 1) { descriptionError.style.visibility = "visible"; } else { descriptionError.style.visibility = "hidden"; } if (amount.value.length < 1) { priceError.style.visibility = "visible"; } else { priceError.style.visibility = "hidden"; } if (invoiceid.value.length < 1 && invoiceidDiv.style.display === "block") { invoiceidError.style.visibility = "visible"; } else { invoiceidError.style.visibility = "hidden"; } purchase_units[0].description = description.value; purchase_units[0].amount.value = amount.value; if(invoiceid.value !== '') { purchase_units[0].invoice_id = invoiceid.value; } }, createOrder: function (data, actions) { return actions.order.create({ purchase_units: purchase_units, }); }, 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>

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.