JQuery
Hosted Fields requires JQuery. The Gateway supports versions 1.8 to 3.6. We use 3.6.3 here:
<script src="https://code.jquery.com/jquery-3.6.3.min.js"></script>
Hostedfields.js
To initialise a Hosted Fields instance, include this JavaScript in your payment page. This script should always be loaded directly from the Blink Gateway.
<script src="https://gateway2.blinkpayment.co.uk/sdk/web/v1/js/hostedfields.min.js"></script>
Custom JS
In addition to that , include this JavaScript to automatically setup the Hosted Form integration.
Please note that an id value is required in this form element to initiate the Hosted Fields js.
This script will automatically append the paymentToken value to the payment form on form submission.
$(function() {
var formID = $('form').attr('id');
var $form = $('#'+formID);
var auto = {
autoSetup: true,
autoSubmit: true,
};
try {
var hf = $form.hostedForm(auto);
} catch(e) {
//Add your exception handling code here
}