Dependent Fields Frame

Follows the Dependent Fields Pattern (See developer documentation) to display form fields that depend on the value of another field.

Samples

Basic

0.3ms 164 allocs
No fields should be shown here.
View Source
<%# here we're wrapping the field to trap the `change` event %>
<%= tag.div data: {
    'controller': "dependable",
    'action': 'change->dependable#updateDependents',
    'dependable-dependents-selector-value': "##{form.field_id(:button, :dependent_fields)}"
  } do %>
  <%= render "shared/fields/buttons",
    form: form,
    method: :boolean_button_value,
    other_options: { label: "Should I present more fields?" } %>
<% end %>

<%= render "shared/fields/dependent_fields_frame",
    id: form.field_id(:button, :dependent_fields),
    form: form,
    dependable_fields: [:boolean_button_value] do %>

  <div class="my-3">
    <% if form.object.boolean_button_value %>
      <strong>More fields would be shown here.</strong>
    <% else %>
      <em>No fields should be shown here.</em>
    <% end %>
  </div>

<% end %>

Options

Name Required Type Default Description
id
String
id of the turbo_frame element
form
ActionView::Helpers::FormBuilder
Reference to the form object
dependable_fields
Array
Attributes of the model for the fields on whose values this frame depends