Dependent Form Fields

Episode #17 by Teacher's Avatar David Kimura

Summary

Using unobtrusive javascript, we can hide certain fields on forms based on the selected values of other fields.
rails javascript view 4:19

Resources

Summary

# Gemfile
    gem 'jquery-turbolinks'
    gem 'dependent-fields-rails'

# application.js
    //= require jquery.turbolinks
    //= require underscore
    //= require dependent-fields

    $(document).ready(function() {
      DependentFields.bind()
    });

# _form.html.erb
    <%= f.input :extended_profile, id: 'user_extended_profile' %>
    <%= content_tag :div, class: 'js-dependent-fields', data: { 'checkbox-id': 'user_extended_profile', 'checkbox-value': 'true'} do %>
      <%= f.input :twitter_handle %>
      <%= f.input :facebook_handle %>
      <%= f.input :github_handle %>
    <% end %>