topic Accept Hosted iframe - passing cusomter data in Integration and Testing

Accept Hosted iframe - passing cusomter data

jm_dgsdev — Fri, 18 Aug 2017 18:13:26 GMT

I'm developing a website to use the Accept Hosted iframe method for checkout. When retrieving a token, I'm trying to pass customer data including the billing address (per the instructions here http://developer.authorize.net/api/reference/#payment-transactions-get-an-accept-payment-page).

However, it seems that this requires the customer to enter their billing address, click submit, and then click another button to submit the token and other information to the iframe. How can I collect the entered billing info, validate it, and submit it to the iframe without needing to click two submit buttons?

Current Steps:

* Enter billing address into form.

* CLICK Submit.

* Validate billing address and generate token for Accept Hosted checkout form.

* CLICK Submit again to post token and billing address to iframe and display checkout form.

Desired Steps:

* Enter billing address into form.

* CLICK Submit.

* Display checkout form in iframe.

Thanks for any advice!

Re: Accept Hosted iframe - passing cusomter data

NexusSoftware — Fri, 18 Aug 2017 19:39:24 GMT

One way is to check your token input's value with Javascript, because it will need to be populated with a valid token in order to get an Accept Payment form, then auto submit the form, if a token is found:

<script>
var token = document.forms["paymentForm"]["token"].value;
if (token > 0) {
document.getElementById("paymentForm").submit();
}
</script>

Re: Accept Hosted iframe - passing cusomter data

jm_dgsdev — Fri, 18 Aug 2017 22:11:09 GMT

Thanks for your response.

That's not exactly what I meant, but I am having some success by using AJAX to validate my form.

So far, I'm using JavaScript to intercept the form submission. I make an AJAX call to another script that validates the form values, submits them to authorize.net, and returns an Accept Hosted form token. So, when I submit my form with appropriate values, the AJAX call returns a token and I can inject it into the form before submission to the iframe is executed.

I'm considering something further: configure the form to submit to the Accept Hosted "full redirect method", instead of the iframe method. That way it can serve as a fall-back in case the browser doesn't support JavaScript. Then, upon the response from my AJAX call, my JavaScript can generate a completely new form element to submit the token to the iframe, append it to the document, and submit it.

Thanks again for your suggestion.

I'll try to work up an example to post here when I've got it nailed down.

Re: Accept Hosted iframe - passing cusomter data

NexusSoftware — Fri, 18 Aug 2017 22:21:49 GMT

With Ajax :

success: function(data) {
var obj = $.parseJSON(data);
$("#token").val(obj['token']);
 if($("#token").val() !=''){
$("#payform").submit();
	}