Payment With Javascript Event
If you want to make a payment from javascript function instead of form submit, you can use My2c2p.submitForm.
Prepare Payment Request with JavaScript Event
Accept input data from user
<form id="2c2p-payment-form" action="./payment_3d.php" method="POST">
<input type="text" data-encrypt="cardnumber" maxlength="16" placeholder="Credit Card Number"><br/>
<input type="text" data-encrypt="month" maxlength="2" placeholder="MM"><br/>
<input type="text" data-encrypt="year" maxlength="4" placeholder="YYYY"><br/>
<input type="password" data-encrypt="cvv" maxlength="4" autocomplete="off" placeholder="CVV2/CVC2"><br/>
<input type="button" value="Checkout" onclick="Checkout()">
</form>
Submit code
<!--Importing 2c2p JSLibrary-->
<script type="text/javascript" src="https://demo2.2c2p.com/2C2PFrontEnd/SecurePayment/api/my2c2p.1.6.9.min.js"></script>
<script type="text/javascript">
<!--checkout function-->
function Checkout() {
My2c2p.submitForm("2c2p-payment-form",function(errCode,errDesc){
if(errCode!=0){ alert(errDesc+" ("+errCode+")"); }
});
}
</script>
Complete code
Copy & Paste below code to 'payment_3d.php' file, and put this file in your Web Server.
<html>
<head>
<title>2C2P PGW Secure Pay API DEMO (3DS)</title>
</head>
<body>
<form id="2c2p-payment-form" action="./payment_3d.php" method="POST">
<input type="text" data-encrypt="cardnumber" maxlength="16" placeholder="Credit Card Number"><br/>
<input type="text" data-encrypt="month" maxlength="2" placeholder="MM"><br/>
<input type="text" data-encrypt="year" maxlength="4" placeholder="YYYY"><br/>
<input type="password" data-encrypt="cvv" maxlength="4" autocomplete="off" placeholder="CVV2/CVC2"><br/>
<input type="button" value="Checkout" onclick="Checkout()">
</form>
<!--Importing 2c2p JSLibrary-->
<script type="text/javascript" src="https://demo2.2c2p.com/2C2PFrontEnd/SecurePayment/api/my2c2p.1.6.9.min.js"></script>
<script type="text/javascript">
<!--checkout function-->
My2c2p.submitForm("2c2p-payment-form",function(errCode,errDesc){
if(errCode!=0){ alert(errDesc+" ("+errCode+")"); }
});
}
</script>
</body>
</html>
Comments
Please sign in to leave a comment.