Hey Andy, I'm afraid your question is a bit tough to follow. Can you clarify a bit? It sounds like this form is loading on every page/visit? Is it part of your template? Give us a bit more info. An AJAX call to a MODX resource isn't difficult, but I can't work out why that would help you. If this is simply an iframe, it would be easy enough to write up some Javascript to load the iframe on request, but that may not be what you're looking for? Please elaborate if you can.
The booking form needs to be available from every page. But is hidden until a user clicks 'book now'.
Currently it's in my template.
This means it's loading in the booking form and adding to page load even though the majority of visitors aren't booking anything.
What I want to do is save the form in a chunk or resource and then have a link which loads that chunk or resource into a modal window.
Put what you want in the chunk. Then have a resource with the no template and only the chunk tags. You can even customize this more by passing data in the AJAX call and using a snippet instead of a chunk to get the data from the POST and load the appropriate chunk along with the data where it's needed. The AJAX call will return the processed chunk.
I'm working on something very similar, an application form that will pop up as an overlay when a button next to an item in a row of similar items is clicked. It fetches the form from a chunk in a form.html resource, with certain information already set in hidden fields. The form submission button is another AJAX trigger that submits the form to a formit.html resource, where the usual FormIt processing is done, and FormIt's output, either errors and the form again, or a thank-you success message, is returned to the same popup overlay on the same page.
Oh, you might want to check out modstore.pro's AjaxForm extra, which does most of that for you, with a few security tokens and other nice features added. https://modstore.pro/packages/utilities/ajaxform[ed. note: sottwell last edited this post 10 years, 9 months ago.]
Put what you want in the chunk. Then have a resource with the no template and only the chunk tags. You can even customize this more by passing data in the AJAX call and using a snippet instead of a chunk to get the data from the POST and load the appropriate chunk along with the data where it's needed. The AJAX call will return the processed chunk.
I'm working on something very similar, an application form that will pop up as an overlay when a button next to an item in a row of similar items is clicked. It fetches the form from a chunk in a form.html resource, with certain information already set in hidden fields. The form submission button is another AJAX trigger that submits the form to a formit.html resource, where the usual FormIt processing is done, and FormIt's output, either errors and the form again, or a thank-you success message, is returned to the same popup overlay on the same page.