We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 51020
    • 670 Posts
    Hi,

    I have a looking form on a site which is really slowing the site down - it's an iframe from an external booking engine.

    My thought is to load it into a modal window only if the user clicks it - so as to not load it without the request.

    I can't work out how to create an ajax call to pull in a resource though - any tips on this?

    Thanks!
    Andy

    This question has been answered by multiple community members. See the first response.

      • 5430
      • 247 Posts
      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.
        • 51020
        • 670 Posts
        Hi. Sorry for being unclear.

        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.

        I hope that makes a bit more sense!

        Thanks
        Andy



        • discuss.answer
          • 28042 ☆ A M B ☆
          • 24,524 Posts
          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.
            Studying MODX in the desert - http://sottwell.com
            Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
            Join the Slack Community - http://modx.org
            • 28042 ☆ A M B ☆
            • 24,524 Posts
            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.]
              Studying MODX in the desert - http://sottwell.com
              Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
              Join the Slack Community - http://modx.org
              • 51020
              • 670 Posts
              Quote from: sottwell at Dec 17, 2015, 03:28 AM
              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.

              OK thanks - This worked - thanks!!

              • discuss.answer
                • 28042 ☆ A M B ☆
                • 24,524 Posts
                  Studying MODX in the desert - http://sottwell.com
                  Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
                  Join the Slack Community - http://modx.org