<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=520757221678604&amp;ev=PageView&amp;noscript=1">

EMBEDDING A FORM ON YOUR SITE

Posted by Sample Author on Feb 20, 2024 3:50:48 AM
Sample Author

If you are embedding a form on your site and running into issues with the form submitting and saving the data back to Adestra, you may be embedding the Adestra form inside of a <form> tag on your page.

The form downloaded from Adestra is wrapped with a <form> tag and if your page or CMS wraps the whole page with a <form> tag, that will cause the Adestra form to be nested inside of another form. This will cause the Adestra form, upon submitting, to clear the fields, it won't write the data to the list, and it won't redirect. 

A solution to this problem is to use an iFrame.  There are two caveats to this solution.

1. If you download the form code and host it on your site to be shown in the iFrame, you will need to modify the Adestra form code by adding target="_parent" on the Adestra <form> tag inside of the iFrame.  Then it will redirect outside of the iFrame to your thank you page correctly instead of showing the thank you page inside of the iFrame.

2. If you are just using the link to the form inside of the iFrame, then you will need to add the following JavaScript to the JavaScript field inside of the Adestra form settings.  See below.

setTimeout(function () {
document.getElementsByTagName("form")[0].setAttribute("target", "_parent");
}, 3000);

 

This will update the Adestra <form> tag to include the target="_parent" code so that your form will redirect outside of the iFrame.

Topics: forms


Featured Articles