Description
This dynamic JavaScript action hook is used to fire events when a form is saved via AJAX in the form editor.
Usage
gform.addAction( 'gform_form_saving_action_' + event_name , function( form, event ) {
//do something
}, 10, 2 );
Parameters
- form Javascript Object
The form currently being saved. - event Javascript Object
The current event object. - …args
One or more additional arguments passed for the current event.
Events
The following events can be used with this dynamic hook:
| Event | …args | Description |
|---|---|---|
save_began | Fires before the save process starts, but after the save button has been clicked or the save shortcut has been triggered. | |
save_aborted | Fires if the form failed validation after the save process has started. | |
save_in_progress | options | Fires just before the save request is sent, and after the form object has been validated. Once this action is fired the UI enters a loading state. |
save_request_failed | response | Fires if the request failed due to a network error. |
save_failed | responseData | Fires if saving the form failed. |
save_succeeded | response | Fires if saving the form was successful. |
save_completed | Fires once the save request is completed. This event is always triggered – even if the request failed. | |
script_before_reload | NewScriptElement scriptElementID currentScriptElement | Fires just before a script tag is being replaced. |
script_after_reload | NewScriptElement scriptElementID replacedScriptElement | Fires just after the script tag has been replaced. |
element_before_reload | newElement elementID currentElement | Fires just before an element is being replaced. |
element_after_reload | newElement elementID replacedElement | Fires after an element has been replaced. |
before_field_setting_added | newSettingElement | Fires just before a new field setting is added. |
after_field_setting_added | newSettingElement | Fires just after a new field setting has been added. |
before_field_setting_deleted | settingElement | Fires just before a field setting element is deleted. |
after_field_setting_deleted | settingElement | Fires just after a field setting element has been deleted. |
before_field_setting_update | currentSettingElement newSettingElement | Fires just before a setting element that has the data-js-reload attribute is replaced. |
after_field_setting_update | settingElement | Fires just after a setting element that has the data-js-reload attribute has been replaced. |
Note: Events related to scripts and elements require that the data-js-reload attribute be present on those elements in the form editor. All elements (i.e. script tags, fields, and field settings) in the form editor that have the data-js-reload attribute will be replaced after a successful save. By default, field settings don’t have the data-js-reload attribute, if you want your field setting to be always replaced with the new markup, you have to add the data-js-reload attribute to its markup.
Examples
Set a form property when saved
This example will set a custom form property before saving the form.
gform.addAction( 'gform_form_saving_action_save_began', function( form, event ) {
form.my_property = "value";
}, 10, 2 );
Add loading class to an element when form is being saved
This example will add a class to an element when save is in progress.
gform.addAction( 'gform_form_saving_action_save_in_progress', function( form, event, options ) {
document.querySelector(".my_element").classList.add("loading");
}, 10, 3 );
Remove loading class from an element when form save is completed
This example will remove a class from an element when the form has completed saving.
gform.addAction( 'gform_form_saving_action_save_completed', function( form, event ) {
document.querySelector(".my_element").classList.remove("loading");
}, 10, 2 );
Since
This action hook was added in Gravity Forms 2.6
Source Code
This action is located in FormSaverEventsManager.trigger() in /assets/js/src/admin/save-form/form-saver-events-manager.js