File: /home/imensosw/www/imenso.co/beta/payment/payment_auth/index.html
<!DOCTYPE html>
<html>
<head>
<title>Payment Form</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" >
<script type="text/javascript" src="https://jstest.authorize.net/v1/Accept.js" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<h1>Payment Form</h1>
<form id="paymentForm">
Card Number<br>
<input type="tel" class="form-control" id="CARDNUMBER_ID" placeholder="5424000000000015" value="5424000000000015" autocomplete="off" /><br><br>
Expiration Date (Month)<br>
<input type="text" class="form-control" id="EXPIRY_MONTH_ID" placeholder="12" value="12" /><br><br>
Expiration Date (Year)<br>
<input type="text" class="form-control" id="EXPIRY_YEAR_ID" placeholder="2020" value="2020" /><br><br>
Card Security Code<br>
<input type="text" class="form-control" id="CARD_CODE" placeholder="900" value="900" /><br><br>
Amount<br>
<input type="text" class="form-control" id="AMOUNT" placeholder="10.00" value="10.00" /><br><br>
ZIP<br>
<input type="text" class="form-control" id="ZIP" placeholder="46282" value="" /><br><br>
<button type="button" class="Button" id="submitButton" onclick="sendPaymentDataToAnet()">Pay</button>
</form>
<script type="text/javascript">
// Upon clicking the "Pay" button, extract the card number and expiration date, and pass those to Accept.js for submission to Authorize.Net
function sendPaymentDataToAnet() {
var secureData = {}; authData = {}; cardData = {};
cardData.cardNumber = document.getElementById("CARDNUMBER_ID").value;
cardData.month = document.getElementById("EXPIRY_MONTH_ID").value;
cardData.year = document.getElementById("EXPIRY_YEAR_ID").value;
cardData.cardCode = document.getElementById("CARD_CODE").value;
cardData.zip = document.getElementById("ZIP").value;
secureData.cardData = cardData;
// The Authorize.Net Client Key is used in place of the traditional Transaction Key. The Transaction Key is a shared secret and must never be exposed. The Client Key is a public Key suitable for use where someone outside the merchant might see it.
authData.clientKey = "796rVn7yYJ7a5pTZus32u7U5M4kxzcTVHBFYSHcA8qj5L65Y9B3pc3wY4H336QyH";
authData.apiLoginID = "376BHsqVW";
secureData.authData = authData;
Accept.dispatchData(secureData, responseHandler);
// When the response is returned from Accept.js, validate that the data looks correct, and record the OpaqueData to the console, and call the transaction processing function.
function responseHandler(response) {
if (response.messages.resultCode === "Error") {
for (var i = 0; i < response.messages.message.length; i++) {
console.log(response.messages.message[i].code + ": " + response.messages.message[i].text);
}
alert("accept.JS library error!")
} else {
console.log(response.opaqueData.dataDescriptor);
console.log(response.opaqueData.dataValue);
callTransactionProcessor(response.opaqueData);
}
}
}
// Using query.js, do an AJAX call to a separate URL on the site to do the actual transaction processing.
function callTransactionProcessor(responseData) {
$.ajax({
url: "https://imenso.co/dev/payment/authorize/process.php",
data: {amount: amount, dataDesc: responseData.dataDescriptor, dataValue: responseData.dataValue},
method: "POST",
timeout: 5000
}).done(function(data){
console.log("Success");
}).fail(function(){
console.log("Error");
}).always(function(textStatus){
console.log(textStatus);
messageFunc(textStatus);
})
}
// The result of the transaction processing will be returned from the processing script as a JSON object. Parse the object to determine success or failure, and alert the user.
function messageFunc(returnMsg)
{
try{
responseObj=JSON.parse(returnMsg);
if(responseObj.transactionResponse.responseCode=="1"){
message="Transaction Successful! - Transaction ID: "+responseObj.transactionResponse.transId;
}
else{
message="Transaction Failed";
if(responseObj.transactionResponse.errors!=null)
{
message+=responseObj.transactionResponse.errors.error.errorText;
}
if(responseObj.transactionResponse.transId!=null)
{
message+=(" - Transaction ID: "+responseObj.transactionResponse.transId)
}
}
}
catch(error){
console.log("Couldn't parse result string");
message="Error.";
}
alert(message);
}
</script>
</body>
</html>