Pause a Redirect of the Form

Please note that this is now available as a plugin for easier installation. While you can use this document as a reference, the recommended method to add this functionality is through the plugin installation wizard. Learn more about plugins here. 

You may want to pause your form's redirect for many reasons. In this instance, a user wanted to pause the redirect while a Make (formerly Integromat) scenario ran. Here we have provided a JavaScript solution to complete this. 

Step 1

Find the Component ID of the form you want to delay so we can target that form’s submit button and only that form’s submit button.

Step 2

Add the following JavaScript to the JavaScript tab on the parent page (the page that contains the form), not the details page.

TB.render('component_ID', function(data) {
    data.ele.find('.form-submit button').click(function() {
        $('body').append('<div class="loader"><p>The contract is being generated, please wait2...</p></div>');
        setTimeout(function() {
            location.reload();
        }, 10000);
    });
});

Step 3

Lastly, add the following to the CSS tab on the details page.

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../../../images/spinner-light.gif') 50% 50% no-repeat rgb(249, 249, 249);
    display: flex;
    justify-content: center;
    align-items: center;
}

.loader p {
    margin-top: 200px;
}

Original Community Post:

https://community.tadabase.io/t/using-js-to-pause-a-redirect-using-js-to-refresh-a-page-after-an-action-button-is-clicked/101#:~:text=Jun%20%2720-,Hey%20Tim!,-Scenario%201%3A