trust-my-travel-legacy
Version:
SDK for the Trust My Travel legacy payments API.
74 lines (63 loc) • 2.34 kB
HTML
<head>
<script src="https://core.spreedly.com/iframe/iframe-v1.min.js"></script>
<script>
function submitPaymentForm() {
// These are the fields whose values we want to transfer *from* the
// master form *to* the payment frame form.
var paymentMethodFields = ['full_name', 'month', 'year'];
options = {};
for (var i = 0; i < paymentMethodFields.length; i++) {
var field = paymentMethodFields[i];
options[field] = document.getElementById(field).value;
}
Spreedly.tokenizeCreditCard(options);
}
</script>
</head>
<p>Hello world</p>
<form id="payment-form" onsubmit="submitPaymentForm(); return false;">
<input type="hidden" name="payment_method_token" id="payment_method_token" />
<label for="full_name">Name</label>
<input type="text" id="full_name" name="full_name" value="Test Name" /><br />
<label>Credit Card Number</label>
<div
id="spreedly-number"
style="width: 225px; height: 35px; border: 2px solid;"
></div>
<br />
<label for="spreedly-exp-month">Expiration Date</label>
<input type="text" id="month" name="month" maxlength="2" value="01" />
<input type="text" id="year" name="year" maxlength="4" value="2030" /><br />
<label>CVV</label>
<div
id="spreedly-cvv"
style="width: 60px; height: 35px; border: 2px solid;"
></div>
<br />
<input id="submit-button" type="submit" value="Pay Now" disabled />
<script>
// Initialise with token
Spreedly.init('2VliQoIvXLLyW2vTn7kPWotrMId', {
numberEl: 'spreedly-number',
cvvEl: 'spreedly-cvv',
});
// On ready, fill in dummy card details
Spreedly.on('ready', function () {
Spreedly.setValue('number', '4111111111111111');
Spreedly.setValue('cvv', '123');
var requiredFields = {};
requiredFields['full_name'] = document.getElementById('full_name').value;
requiredFields['month'] = document.getElementById('month').value;
requiredFields['year'] = document.getElementById('year').value;
// Get x tokens
for (let i = 0; i < NUMBER_OF_TOKENS; i++) {
Spreedly.tokenizeCreditCard(requiredFields);
}
});
// Get the token and details back
Spreedly.on('paymentMethod', function (token, paymentMethod) {
console.log(token);
});
</script>
</form>