Embed a Formstack form asynchronously, using Postscribe

formstack-embed-using-postscribe.html

// https://github.com/krux/postscribe
<!-- Main form wrapper, required for styling the form -->
<div class="webform">
    <!-- Empty div (must have a unique ID), into which the form will be loaded -->
    <div id="formstack-bridal-appointment"></div>
    <script type="text/javascript">// <![CDATA[
    // Only run the code below when jQuery says the document is ready
    (function($) {
      // Process the form using postscribe:
      // 1. Must reference the unique ID of the div above
      // 2. Must contain the embed URL from Formstack
      // 3. Must contain the selectBoxes() function in the `done` callback to style any select lists in the form
      postscribe('#formstack-bridal-appointment', '<script src=//gpmd-test.formstack.com/forms/js.php/bridal_appointment?nojquery=1&nojqueryui=1&nomodernizr=1&no_style_strict=1><\/script>', {
        done: function() {
          // Style select lists
          $('.webform select').selectBoxes();
        }
      });
    })(jQuery);
    // ]]></script>
</div>

@matt-bailey Did you happen to have any issues around inline validations with this method?

@tmilewski I'm pretty sure it all worked ok at the time, but it was a while ago and I haven't revisited the project since.

@matt-bailey Thanks for the reply. After spending a bit of time trying to get it all to work, we wound up using the iframe. 🤷, haha.