Home › Forums › Front-end Issues › acf_form_head and google map form inside a modal
So, I am in a bit of a dilemma here and wanted to ask in the community for suggestions that might help me solve my problem.
Currently for my webapp, I am only using acf_form_head() when required – that is I load it in specific pages where forms are used.
Now, I have to create an option that includes a google map to specify ‘current location’ and want it accessible through an option at the header – the common tactic for this sort of thing is to place it inside a modal. I don’t want the user to be redirected to a different page – which would be my last resort.
The problem is, that in order to use it, I must use acf_form_head EVERYWHERE, which, tbh I am a bit afraid of it – although I am not certain if I should. I am afraid that this could trigger unwanted behavior in non-acf forms.
So, I am thinking something like the following:
– Ideally, I would be able to just load the google map with its input form, export the lat, long through js and save through a custom function – this is irrelevant to ACF I guess, but was wondering if I can somehow use what’s already built in.
– Create a separate page and load the through an Iframe. However, I am not sure if loading acf_form_head() there would cause any issues to any forms outside of it, eg like trigger a different form, etc. I am wondering if there’s a way to ‘unload’ the acf_form_function.
So, any pointers, on the best way to achieve what I am after?
Any suggestions or pointers are welcome.
As far as using acf_form_head() everywhere, this should not create any interference with other forms on the site. ACF only does something if the $_POST[‘acf’] array is populated and this will only happen when submitting an acf form.
As far as not refreshing goes, I would look into an AJAX solution for form submission. This might be a place to start.
John, thank you for the fast reply.
So, you suggest that it would be safe to use acf_form_head() inside header.php?
What would happen in cases where the map could be on top of a page that already includes its own form?
The AJAX solution seems interesting, but it comes after resolving the main issue.
Separate forms are submitted separately. Only the content inside of each
<form></form> element is submitted.
John, thanks for the pointers!
John.. or anyone else…?
Is there a way to strip acf_form_head() down to the basics required just for google map? Because it loads all kinds of things like datepickers, etc, etc..?
I managed to make the functionality required, but I find it to be too heavy loading all this stuff. :/
I think that’s been asked before and I don’t think you can. I forgot that ACF does add a lot of scripts that are needed to make the fields work.
My suggestion would be to add acf_form() to every page and then check to see if it’s going to be needed in some way, that that might be complicated.
You’d have to figure out a way before the the header is loaded, or at the top of header.php to see if a form will be included.
Thanks again for your interest John!
Actually, I found my way through this problem and sharing here, in case it helps anyone.
Since I wanted this map to be set globally from the header, then it would require the
acf_form_head() to be always loaded.
It took some effort, but I ended up with this solution:
– Created a separate page
– Added the google map form and styled it to stretch and occupy the whole screen
– Hid all other elements (header, footer, etc)
– Loaded the above page with jquery as an iframe and styled the iframe itself to look like a modal
– After the form submission I look for the $_GET[‘updated’] and if true, I load an inline script to remove the modal
This way, I don’t need to leave my current page, nor do I have to lead the
acf_form_head() where not needed.
You must be logged in to reply to this topic.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
The most recent ACF Chat Friday featured a live demo of how to register CPTs directly in the plugin, one of our most requested features. Check out the summary below for a replay of the demo, and don’t forget to register for the next session! https://t.co/k2KQ3WWBAz— Advanced Custom Fields (@wp_acf) March 9, 2023
© 2023 Advanced Custom Fields.