How to tokenize CC without submit iFrame

[alecsfp]

I am trying to tokenize credit card data without using an iframe submit button. In the Heartland example I see cardExternalTrigger as the solution to this; however no requests are made and the token-success event does not fire.

document.getElementById('place-order-btn').addEventListener('click', function(event) {
	event.preventDefault();

	for (var type in cardForm.fields) {
		if (type === "submit") {
			continue;
		}

		var field = cardForm.frames[type];
		
		if (!field) {
			continue;
		}

		GlobalPayments.internal.postMessage.post(
			{
				data: {
					fields: cardForm.fields,
					target: field.id
				},
				id: field.id,
				type: "ui:iframe-field:request-data",
			},
			field.id
		);
	}

	cardForm.on("token-success", (resp) => {
		// Save payment token
		this.paymentToken = resp.paymentReference;
		console.log('token recieved')

		// Submit data to the integration's backend for processing
		// that.submitForm();
	});

	cardForm.on("token-error", (resp) => {

	});
});