TutorialInline Real-Time Editing Gravity Forms Field Values

Do you want to quickly edit a single Gravity Form Field Value, without having to open the complete Entry Edit screen? Both in the backend and frontend of your site? With the Inline Edit Add-on from GravityView you can easily do that.

How inline editing works for form admins

Inline Edit adds a settings option to your Gravity Form:

Enabling the Inline Edit functionality on the Entries page in Gravity Forms.
Enabling the Inline Edit functionality on the Entries page in Gravity Forms.

By enabling it, a new button appears on your Entries page: ‘Enable Inline Edit’

Screenshot of the Gravity Forms Entries page with the button Enable Inline Edit visible in the right corner above the list.
Screenshot of the Gravity Forms Entries page with the button Enable Inline Edit visible in the right corner above the list.

After enabling Inline Edit, all the fields you can edit get a dotted blue line. When clicking on the field, you can super fast select other values for that field. See for example this example about quickly change the checkbox values of selected entry:

Screenshot of changing or selecting an individual Checkbox field inline.
Screenshot of changing or selecting an individual Checkbox field inline.

Or a dropdown:

Screenshot of changing or selecting a Dropdown value inline.
Screenshot of changing or selecting a Dropdown value inline.

Or a Date Field:

Screenshot of selecting a Date Field value inline.
Screenshot of selecting a Date Field value inline.

Or a Single Line Text:

Screenshot of changing a Single Line Text value inline.
Screenshot of changing a Single Line Text value inline.

Or a Paragraph Text Field:

Screenshot of inline changing of a Paragraph Text Field.
Screenshot of inline changing of a Paragraph Text Field.

Rich Text Editor also works, but with the HTML visible:

Screenshot of inline changing of a Paragraph Text Field with Rich Text Editor enabled.
Screenshot of inline changing of a Paragraph Text Field with Rich Text Editor enabled.

And a Multi Select Field (by pressing CTRL you can select multiple values):

Screenshot of inline editing of a Multi Select Field.
Screenshot of inline editing of a Multi Select Field.

Configuring inline editing for users

You can also create a View and enable inline editing for front-end users. First configure your view with fields on the Multiple Entries Layout that you want to make available for inline editing:

Screenshot of a Gravity View.
Screenshot of a Gravity View.

And than Enable Inline Edit in your View settings:

Screenshot of View Settings with Enable Inline Edit enabled.
Screenshot of View Settings with Enable Inline Edit enabled.

We added some fields to our Table View and in the top corner of the view the text Enable Inline Edit appears. When clicking it, it turns into Disable Inline Edit. It works basically the same as the above examples.

Screenshot of front-end Enable / Disable Inline Edit visible in the right corner above the View output.
Screenshot of front-end Enable / Disable Inline Edit visible in the right corner above the View output.

How we use it in our projects

We use the Inline Edit functionality in the backend when we quickly want to update certain values without having to open every single complete entry in editing mode. For our clients we sometimes configure Inline Edit so they can easily change a status (sometimes multiple) of entries, to move them for example to another bucket or to mark that something is finished.

You have countless possibilities to integrate it and as GravityView says on their website, it saves an enormous amount of time not having to create edit pages or for clients to have to open the complete entry to change a single value.

Read more tutorials about Katz Web Services, Inc.

GravityView by Katz Web Services, Inc. is the best way to display Gravity Forms entries on your website. With GravityView you can easily display entries visitors (or users) of your website made using GravityForms on the front-end. It’s an amazing piece of software and developments are going strong. Katz Web Services, Inc. offers besides GravityView other interesting Add-ons for Gravity Forms like Import Entries, Inline Edit, GravityExport, GravityActions and Math. Visit GravityView.co
All tutorials Katz Web Services, Inc.