Technical
UI/UX, WordPress

Make a Gravity Forms field Read Only So Users Cannot Fill In or Modify

Craig Marolf
Web Developer and Marketing Strategist
Published on October 22, 2024
By Craig Marolf in Technical

Share

Sometimes it’s necessary to prevent form fields from being modified by the website visitor/form user.

Making a field in Gravity Forms read-only is useful when you want to display data that should not be modified by the user. While Gravity Forms doesn’t have a built-in option to make fields read-only, you can achieve this by adding custom code to your WordPress theme.

You can use JavaScript to make a field read-only by adding a custom script that targets the specific field(s).

1. Identify the Field ID:

In the Gravity Forms editor, find the field you want to make read-only and note its Field ID (visible in the field settings).

2. Add Custom JavaScript:

You can add the JavaScript to your theme’s functions.php, a custom JavaScript file, or use a plugin that allows you to add custom JavaScript to your site.

Here’s an example script that you can use:

// Replace `1` with your form ID and `2` with your field ID
jQuery(document).ready(function($) {
    $('#input_1_2').attr('readonly', true);
});

Explanation

#input_1_2 This targets the input field in the form where 1 is the form ID and 2 is the field ID. Adjust these numbers based on your specific form and field.

attr('readonly', true) This sets the field to read-only.

Test the Form

After adding the JavaScript, check your form on the front end to ensure the field is now read-only.