Custom JavaScript success callbacks

There are 3 success callbacks available for you to alter the behaviour when the form is successfully submitted.

  • successStart
  • success
  • successEnd

successStart

successStart is called when the form has been successfully submitted and before any other success code is run. If you want to run any code before anything else this is the place to do it. You can add this on line 3 of js/scripts.js

1
2
3
4
5
$('form.quform').Quform({
    successStart: function (response) {
        // Your custom JavaScript
    }
});
$('form.quform').Quform({
    successStart: function (response) {
        // Your custom JavaScript
    }
});

success

If you specify a success callback this will override the default form success functionality of resetting the form and fading in the success message. If you do specify a custom success function the successEnd function hook will no longer be available, unless you include it in your own code of course. You can add this on line 3 of js/scripts.js

1
2
3
4
5
$('form.quform').Quform({
    success: function (response) {
        // Your custom JavaScript
    }
});
$('form.quform').Quform({
    success: function (response) {
        // Your custom JavaScript
    }
});

successEnd

The successEnd function is called after the default success functionality of fading out the form and fading in the success message has finished animating. You can add this on line 3 of js/scripts.js

1
2
3
4
5
$('form.quform').Quform({
    successEnd: function (response) {
        // Your custom JavaScript
    }
});
$('form.quform').Quform({
    successEnd: function (response) {
        // Your custom JavaScript
    }
});

Data accessible from inside your custom functions

  • this – The Quform object instance
    • this.$form – The jQuery object representing your form
    • this.options – The options object passed to the Quform instance
    • this.$container – The jQuery object representing the form element container
    • this.$loading – The jQuery object representing the loading text/gif
    • this.$submitButton – The jQuery object representing the submit button
  • response – The Ajax response from the server
Be inspired. © 2024 ThemeCatcher Ltd. 20-22 Wenlock Road, London, England, N1 7GU | Company No. 08120384 | Built with React | Privacy Policy