{"id":6308,"date":"2020-10-20T09:48:04","date_gmt":"2020-10-20T14:48:04","guid":{"rendered":"https:\/\/wp.stolaf.edu\/sa\/?page_id=6308"},"modified":"2023-06-07T08:35:38","modified_gmt":"2023-06-07T13:35:38","slug":"paypal","status":"publish","type":"page","link":"https:\/\/wp.stolaf.edu\/sa\/paypal\/","title":{"rendered":"PayPal"},"content":{"rendered":"<div data-modular-content-collection><div id=\"smart-button-container\">\n<div style=\"text-align: center\"><label for=\"description\">Sponsoring Organization <\/label><input type=\"text\" name=\"descriptionInput\" id=\"description\" maxlength=\"127\" value=\"\"\/><\/div>\n<p id=\"descriptionError\" style=\"visibility: hidden; color:red; text-align: center;\">Please enter a description<\/p>\n<div style=\"text-align: center\"><label for=\"amount\">Amount to be Charged <\/label><input name=\"amountInput\" type=\"number\" id=\"amount\" value=\"\"\/><span> USD<\/span><\/div>\n<p id=\"priceLabelError\" style=\"visibility: hidden; color:red; text-align: center;\">Please enter a price<\/p>\n<div id=\"invoiceidDiv\" style=\"text-align: center; display: none;\"><label for=\"invoiceid\"> <\/label><input name=\"invoiceid\" maxlength=\"127\" type=\"text\" id=\"invoiceid\" value=\"\"\/><\/div>\n<p id=\"invoiceidError\" style=\"visibility: hidden; color:red; text-align: center;\">Please enter an Invoice ID<\/p>\n<div style=\"text-align: center; margin-top: 0.625rem;\" id=\"paypal-button-container\"><\/div>\n<\/div>\n<p>  <script src=\"https:\/\/www.paypal.com\/sdk\/js?client-id=sb&#038;currency=USD\" data-sdk-integration-source=\"button-factory\"><\/script><br \/>\n  <script>\n  function initPayPalButton() {\n    var description = document.querySelector('#smart-button-container #description');\n    var amount = document.querySelector('#smart-button-container #amount');\n    var descriptionError = document.querySelector('#smart-button-container #descriptionError');\n    var priceError = document.querySelector('#smart-button-container #priceLabelError');\n    var invoiceid = document.querySelector('#smart-button-container #invoiceid');\n    var invoiceidError = document.querySelector('#smart-button-container #invoiceidError');\n    var invoiceidDiv = document.querySelector('#smart-button-container #invoiceidDiv');<\/script><\/p>\n<p>    var elArr = [description, amount];<\/p>\n<p>    if (invoiceidDiv.firstChild.innerHTML.length > 1) {<br \/>\n      invoiceidDiv.style.display = &#8220;block&#8221;;<br \/>\n    }<\/p>\n<p>    var purchase_units = [];<br \/>\n    purchase_units[0] = {};<br \/>\n    purchase_units[0].amount = {};<\/p>\n<p>    function validate(event) {<br \/>\n      return event.value.length > 0;<br \/>\n    }<\/p>\n<p>    paypal.Buttons({<br \/>\n      style: {<br \/>\n        color: &#8216;blue&#8217;,<br \/>\n        shape: &#8216;pill&#8217;,<br \/>\n        label: &#8216;paypal&#8217;,<br \/>\n        layout: &#8216;vertical&#8217;,<\/p>\n<p>      },<\/p>\n<p>      onInit: function (data, actions) {<br \/>\n        actions.disable();<\/p>\n<p>        if(invoiceidDiv.style.display === &#8220;block&#8221;) {<br \/>\n          elArr.push(invoiceid);<br \/>\n        }<\/p>\n<p>        elArr.forEach(function (item) {<br \/>\n          item.addEventListener(&#8216;keyup&#8217;, function (event) {<br \/>\n            var result = elArr.every(validate);<br \/>\n            if (result) {<br \/>\n              actions.enable();<br \/>\n            } else {<br \/>\n              actions.disable();<br \/>\n            }<br \/>\n          });<br \/>\n        });<br \/>\n      },<\/p>\n<p>      onClick: function () {<br \/>\n        if (description.value.length < 1) {\n          descriptionError.style.visibility = \"visible\";\n        } else {\n          descriptionError.style.visibility = \"hidden\";\n        }\n\n        if (amount.value.length < 1) {\n          priceError.style.visibility = \"visible\";\n        } else {\n          priceError.style.visibility = \"hidden\";\n        }\n\n        if (invoiceid.value.length < 1 &#038;&#038; invoiceidDiv.style.display === \"block\") {\n          invoiceidError.style.visibility = \"visible\";\n        } else {\n          invoiceidError.style.visibility = \"hidden\";\n        }\n\n        purchase_units[0].description = description.value;\n        purchase_units[0].amount.value = amount.value;\n\n        if(invoiceid.value !== '') {\n          purchase_units[0].invoice_id = invoiceid.value;\n        }\n      },\n\n      createOrder: function (data, actions) {\n        return actions.order.create({\n          purchase_units: purchase_units,\n        });\n      },\n\n      onApprove: function (data, actions) {\n        return actions.order.capture().then(function (details) {\n          alert('Transaction completed by ' + details.payer.name.given_name + '!');\n        });\n      },\n\n      onError: function (err) {\n        console.log(err);\n      }\n    }).render('#paypal-button-container');\n  }\n  initPayPalButton();\n  <\/p>\n<p><!-- begin-migrated-from-panel-builder --><!-- end-migrated-from-panel-builder --><\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>Sponsoring Organization Please enter a description Amount to be Charged USD Please enter a price Please enter an Invoice ID var elArr = [description, amount]; if (invoiceidDiv.firstChild.innerHTML.length > 1) { [&hellip;]<\/p>\n","protected":false},"author":4754,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-6308","page","type-page","status-publish","hentry"],"acf":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wp.stolaf.edu\/sa\/wp-json\/wp\/v2\/pages\/6308","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wp.stolaf.edu\/sa\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wp.stolaf.edu\/sa\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wp.stolaf.edu\/sa\/wp-json\/wp\/v2\/users\/4754"}],"replies":[{"embeddable":true,"href":"https:\/\/wp.stolaf.edu\/sa\/wp-json\/wp\/v2\/comments?post=6308"}],"version-history":[{"count":3,"href":"https:\/\/wp.stolaf.edu\/sa\/wp-json\/wp\/v2\/pages\/6308\/revisions"}],"predecessor-version":[{"id":7470,"href":"https:\/\/wp.stolaf.edu\/sa\/wp-json\/wp\/v2\/pages\/6308\/revisions\/7470"}],"wp:attachment":[{"href":"https:\/\/wp.stolaf.edu\/sa\/wp-json\/wp\/v2\/media?parent=6308"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}