gform_input_change

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 .