Description
This JavaScript hook allows further actions to be performed when the keyup or change event is fired for an HTML input. The action only fires when the form is an AJAX form or has one of the following:
- Calculation
- CAPTCHA Field
- Checkbox Field
- Conditional Logic
- Credit Card Field
- Drop Down or Multi Select Field with the Enable enhanced user interface turned on
- File Upload Field
- JavaScript Merge Tags
- List Field
- Number Field Set to Currency
- Page Field
- Password Field with Enable Password Strength turned on
- Price Field
- Repeater Field
Usage
gform.addAction( 'gform_input_change', function( elem, formId, fieldId ) {
//do something
}, 10, 3 );
Parameters
- elem
JavaScript object containing the field input that changed. formId
The ID of the current form.fieldId
The field ID of the current field.
Examples
The following example triggers field validation and paging when a radio buttons field value changes for forms displayed by the Conversational Forms Add-On.
document.addEventListener('DOMContentLoaded', () => {
gform.addAction('gform_input_change', (elem, formId, fieldId) => {
if (elem.type !== 'radio') {
return;
}
const next = gform.utils.getNode('gform-conversational-nav-field-next', document);
if (next) {
next.click();
}
});
});
Placement
Your code snippet can be placed in an HTML field on your form or in a theme custom JavaScript file.
See also the JavaScript/jQuery section in this article: Where Do I Put This Code?
Since
This filter was added in Gravity Forms version 1.9.14.
Source Code
This action hook is located in the function gf_input_change in js/gravityforms.js .