Add Card(Create Binding)

Customer also able to add card information(binding) and process payment without input card information repeatedly. Therefore, payment with binding required user to authenticate their pass-code before

Add Card

Figure 01: Choose Payment Method

Add PAYON Card

Figure 02 - Add Payon Card

Add Credit/Debit Card

Figure 03 - Add Credit/Debit Card

Implementation

Include PAYON's lib

Add PAYON's lib helper for client side to your create binding page.

  <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
     <script th:src="@{../js/payonUtils.js}" charset="utf-8" type="text/javascript"></script>
  </html>

Prepare Add Card Button


<body>
    <button class="btn btn-primary" id= "addCard">ADD CARD</button>  	
 
</body>

Prepare Add Card Scripts

$("#addCard").click(function(){
		  
	var merchantId =  $('#merchantId').val();
	var termId = $('#termId').val();
	var clientId = $('#clientId').val();
	var env = $('#env').val();
	let payonUtils = new PayonUtils("","","",merchantId,termId,"",env,"",clientId);
	payonUtils.payonPgCreateBinding();
});

PreviousTest your paymentNextPayment Order Registration

Last updated

Was this helpful?