We are trying to get the form working on our new website using the automatic javascript string and it does load the form on the page but the form submission is not sending the data over to Mautic.
Does the website where the form is being loaded on with the automatic JavaScript string need to have php support as well too? Or only on Mautic’s end?
Where does the action attribute points ? Mautic instance? then you only need php support on server where mautic is installed.
Thanks for the quick response! It what I thought too. Yes Mautic is installed and has been running on a server with php 7.4
Our main website we moved to a new server that use React / Windtail CSS but the form on it is just not submitting the data over to Mautic.
All other form on other servers are working fine just not on the cloud that use React to load website.
how exactly did you include the form using react? I can see there will be challenges to do so, due to how react construct the page dynamically, and constantly changes the HTML DOM, which can mess the loading and manipulation done by mautic, I think the safest way to include the form would be to use the iframe option.
With Automatic javascript string like this
<script type="text/javascript" src="//domainnamehere.org/form/generate.js?id=17">
Will react also break the Mautic tracking code too?
Here the link to the form - https://agwm.org/en/contact-us/
probably. react is a single page application, usually, all navigation just change the html content via javascript either content pre-loaded into the page but not rendered or loading new data thru http requests and then rendering the html without actually changing the page url, which will make mautic just record the first load of the react app.
a workaround is to implement the tracking in the react app it self by calling the mautic pixel everytime there is an action in the react app that is worth tracking, the documentation briefly explore that possibility : Contact tracking | Mautic
ok, from what I can see this page does not use react. so the solution might be easier, I can take a look later today
Thank you.
It’s really frustrating me to get this working again.
Our department decided to contract out to have new website developed and I was told they are using react and tailwind css to develop the new site. Maybe they went with other method and not updated me.
ok, I check the page now and it seem the form is loading. they change from form 111 to form 17, so perhaps the problem was just the wrong id.
But looking at the page source code, they are not including the form as it says in the documentation:
I don’t think it is a problem to include the script the way they did, the only problem is to include a form within a form, I think they are trying to submit the same form to two different places, but this can lead to unexpected behavior since its prohibit in html4/5 standards.
The 17 is the correct id for this form. Sorry I will fix my previous post and correct it.
I see … so in way they added and place Matuic JavaScript inside this form element?
Like this
<form>
<script>Mautic form Javascript</script>
</form>
that may be causing my issue?
yes, that might be the issue, they should remove that form element
They did and it’s working!
I thought it was generated by Mautic when I saw it … Thank you so much for pointing that out!
but in my browser it seem to be working
That cuz I told them to that that element out … it was not needed … I am not even sure why they added it in.