OnePay Plugin with Add & Edit Card

Checkout allows you to quickly and easily enter user details and complete the payment in a few easy steps.

OnePay Token

Show Dev code

Code of HTML

				
					
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>OnePay Token</title>
  
</head>
<body>
   
    <div id="ResultOnepayResponse"></div>
    <input id="onepayResult" type="hidden" />
    <input id="onepayToken" type="hidden" />

    &nbsp; <button id="btnAdd"> Add card</button>

    <div id="divonepayiframe"> </div>

    <!--data-displayMode  is popup  or inline-->
   

</body>
</html>

Code of Javascript

				
					<script id="scriptIframe" type="text/javascript" src="https://apidemo.onepay.com/payUI/onepay.min_v3.0.js"
            data-key='ed6879be-203e-9f51-d4da-77b8a8d11a36'
            data-displayMode="popup"
            data-mode='token'>
</script>

				
					<script> 
   //Show response in Div from onepayResult hidden field. Edit card is success, onepay response stores in onepayResult hidden field value
   function ShowOnePayResponse() {
//document.getElementById("ResultOnepayResponse").innerHTML = document.getElementById("onepayResult").value;
let jsonResult = JSON.parse(document.getElementById("onepayResult").value);

if (jsonResult != undefined && jsonResult.customer_response !== undefined) {
resultText = jsonResult.customer_response.result_text
if(jsonResult.customer_response.result_code === 1){
alert("Card/token information added success" ); // popup or display success status
}
}
}

    btnAdd.onclick = function () {
        let customerId = ''; 
        // params are 1) div id for render iFrame in Div, 2) customerId is optional 3) Call back method is optional
        //AddCard( 'divonepayiframe', customerId, ShowOnePayResponse);

        //
        AddCard( '', '', ShowOnePayResponse);

        //// without param , after close inspect value of onepayResult  hidden field
        // AddCard();
    }

</script>