hey, I want to implement a payment gateway after the submission of a Event marketing form. I am able to get the payment form but having hard time getting the payment token in javascript. I am using authorize.net payment gateway. I will paste the code below , please help me generate the token for payment. Thanks!
<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<head>
<title>HostedPayment Test Page</title>
<script src="scripts/lib/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("#btnOpenAuthorizeNetIFrame").click(function () {
$("#add_payment").show();
$("#send_token").attr({ "action": "https://test.authorize.net/payment/payment", "target": "add_payment" }).submit();
});
});
</script>
</head>
<body>
<div>
Open Authorize.net in an iframe to complete transaction
<button id="btnOpenAuthorizeNetIFrame" onclick="">Show Payment Form</button>
</div>
<div id="iframe_holder" class="center-block" style="width:90%;max-width: 1000px;height:90%max-height: 1000px">
<iframe id="add_payment" class="embed-responsive-item panel" name="add_payment" width="100%" height="1000" frameborder="0" scrolling="yes" hidden="false">
</iframe>
</div>
<form id="send_token" action="" method="post" target="add_payment" >
<input type="hidden" name="token" value="TOKEN VALUE" />
</form>
<script type="text/javascript">
(function () {
if (!window.AuthorizeNetIFrame) window.AuthorizeNetIFrame = {};
AuthorizeNetIFrame.onReceiveCommunication = function (querystr) {
var params = parseQueryString(querystr);
switch (params["action"]) {
case "successfulSave":
break;
case "cancel":
break;
case "resizeWindow":
var w = parseInt(params["100%"]);
var h = parseInt(params["100%"]);
var ifrm = document.getElementById("add_payment");
ifrm.style.width = w.toString() + "px";
ifrm.style.height = h.toString() + "px";
break;
case "transactResponse":
var ifrm = document.getElementById("add_payment");
ifrm.style.display = 'none';
}
};
function parseQueryString(str) {
var vars = [];
var arr = str.split('&');
var pair;
for (var i = 0; i < arr.length; i++) {
pair = arr[i].split('=');
vars.push(pair[0]);
vars[pair[0]] = unescape(pair[1]);
}
return vars;
}
}());
</script>
</body>
</html>