Has anyone succeeded in combining eForm and the
ColorBox jQuery plugin to create a nice popup contact form?
I’m half way there, in that I’ve managed to get ColorBox to load the eForm template from hidden inline html. When there are no validation issues it sends form data and closes correctly.
However (and this won’t make much sense if you aren’t familiar with ColorBox):
1) if the form doesn’t validate, the eForm default behaviour seems to reload the page with the errors in the [+validationmessage+] placeholder. This means the ColorBox popup is hidden again and the validation message ends up within the hidden inline HTML of the main page. Ideally, I want the validation message to load in the ColorBox popup, so the user doesn’t wonder why the form closed.
2) On successful submit, again the page reloads and the ’thankyou message’ is displayed on the main page instead of in the popup. It’s not the end of the world but from a usability perspective I would prefer the message to load in the popup and then be closed by the user.
Yep, I thought of iFrames...
I recognise that this could all be done by loading the form as an iFrame, as the eForm actions would be happening on the page contained within the iFrame. But to complicate things, my form fields are pre-populated with contents of the current page TVs (it’s a real estate site, and the contact form can be opened from any page). If there’s a way to send those to a generic form template contained in an iFrame then great!
*** thinking out loud - sharkbait may have a solution for
passing tv values to another doc. Looking into it.
Ajax?
Here’s what the ColorBox author has to say about
loading form results via Ajax. But I don’t know if it’s possible to use the jQuery forms plugin with eForm!
If anyone has come close or has any ideas, please let me know and perhaps we can work on a solution? Or if you’ve already worked it out...
Cheers
Luke