Skip to content

Grid

The Grid field lets users add multiple rows of the same set of fields. Useful for things like "add another passenger", "add another line item", or any repeater-style input. Each row contains the same sub-fields and users can add or remove rows as needed.

A list of people interested in buying your apartment.
A list of people interested in buying your apartment.

Basic Grid

A simple repeatable grid with text sub-fields.

Statamic Field Configuration:

  • Field Type: Grid

Example:

yaml
handle: grid_field
field:
  add_row: 'Add User'
  max_rows: 10
  type: grid
  display: 'Grid Field'
  fields:
    -
      handle: full_name
      field:
        type: text
        display: 'Full Name'
        width: 50
    -
      handle: date_of_birth
      field:
        input_type: date
        improved_field: true
        max_date_today: 0
        type: text
        display: 'Date of Birth'
        width: 50
    -
      handle: nationality
      field:
        dictionary:
          type: countries
          emojis: true
        type: dictionary
        display: Nationality

Available Settings

  • min_rows: Minimum number of rows. Users can't remove rows below this count. Defaults to 1.
  • max_rows: Maximum number of rows. The "Add Row" button hides when the limit is reached.
  • fixed_rows: Set an exact number of rows. Add and remove buttons are hidden.
  • dynamic_rows_field: Handle of another field (e.g., an integer) that controls the row count. When the controlling field changes, rows are added or removed automatically.
  • add_row: Custom text for the "Add Row" button. Defaults to "Add Row".

TIP

fixed_rows takes precedence over dynamic_rows_field. When either is set, add/remove buttons are hidden — the row count is fully controlled.

Dynamic Rows

Using dynamic_rows_field you can control the number of rows displayed by using another field. Using this feature you can use a field like an integer to show / hide rows. You can check an example in the Jobs example.

You can also combine it with the prepopulated_data and a hidden field to set the number of rows using Antlers / PHP.

Let's say you are getting inquiries for a an excursion that requires at least 4 persons and you want to have the details of each passenger. Each excursion's entry has a number_of_passengers field that sets how many people need to register. In you form. you have a hidden field with the handle quantity and you set it as the dynamic_rows_field for the grid. You can load the form as such:

antlers
{{ easyform handle="enquire" :prepopulated_data="['quantity' => $number_of_passengers]" }}

And the grid will automatically display the number of rows you need.

Validation

Validation rules are defined on each sub-field and apply per row. Laravel's standard array validation kicks in automatically — Easy Forms maps grid fields to handle.*.subfield rules on the server side.

WARNING

Grid fields are not compatible with Laravel Precognition real-time validation. They are fully validated on form submission.

Best Practices

Row Limits

  • Always set a reasonable max_rows to prevent abuse
  • Use min_rows to ensure at least the necessary data is collected
  • Prefer fixed_rows or dynamic_rows_field when the number of entries is known or derived

Sub-fields

  • Keep the number of sub-fields per row manageable — wide grids with many columns can be hard to use on mobile
  • Use clear, short labels since they repeat on every row
  • Add validation to each sub-field individually

User Experience

  • Use a descriptive add_row text so users know what they're adding (e.g., "Add Passenger" instead of "Add Row")
  • Use display to give the grid a clear heading