gform_field_added

Description

The gform_field_added JavaScript filter in Gravity Forms fires after a form field is added, either in the Form Editor or programmatically.

Usage

<script type="text/javascript">
	( function () {
		if ( window.myFieldAddedBound ) return; // avoid double-binding
		window.myFieldAddedBound = true;

		const previous = document.ongform_field_added;

		document.ongform_field_added = function ( event, form, field ) {
			if ( form && form.id == 44 ) {
				// do something specific to this form
				alert( 'Your new field id is: ' + field.id );
			}
			// keep any handler that was already assigned
			if ( typeof previous === 'function' ) {
				return previous.apply( this, arguments );
			}
		};
	} )();
</script>

Parameters

ParameterTypeDescription
eventEvent ObjectDefault JS event object.
formForm ObjectThe current form object.
fieldField ObjectThe current field object.

Examples

Display a message when a field is added.

This example uses the gform_admin_pre_render filter to load the hook. A message is displayed when the form id is 44 and new fields are added.

add_action( 'gform_admin_pre_render', 'field_added_pre_render' );
function field_added_pre_render( $form ) {
	?>
	<script type="text/javascript">
		( function () {
			if ( window.myFieldAddedBound ) return; // avoid double-binding
			window.myFieldAddedBound = true;

			const previous = document.ongform_field_added;

			document.ongform_field_added = function ( event, form, field ) {
				if ( form && form.id == 44 ) {
					// do something specific to this form
					alert( 'Your new field id is: ' + field.id );
				}
				// keep any handler that was already assigned
				if ( typeof previous === 'function' ) {
					return previous.apply( this, arguments );
				}
			};
		} )();
	</script>
	<?php
	return $form;
}

Placement

Reference the article Adding JavaScript Code to the Admin Side of Your Site.

Source Code

This filter is located in form_editor.js.