Geek Answers Handbook

Rails 4 - Conditional JS with dependent rails

I'm trying to figure out how to use field-dependent rails fields with my Rails 4 application.

I'm lost.

I included underscore.js in my vendor's javascripts folder and updated the application.js application to include (right below, just above the required tree):

//= require underscore //= require dependent-fields $(document).ready(function() { DependentFields.bind() });

In my simple form, I:

 <%= f.input :has_milestones, as: :boolean, boolean_style: :inline, :label => 'Any decision points?', id: 'check_project_milestones' %> <%= content_tag :div, class: 'js-dependent-fields', data: {'checkbox-id': 'check_project_milestones', 'checkbox-value': 'true' } do %> <div class="intpol2"> Milestones </div> <%= f.simple_fields_for :milestones do |f| %> <%= render 'milestones/milestone_fields', f: f %> <% end %> <% end %>

However, when I restart the server and render the form, the first question is displayed with the div identifier (which the checkbox is disabled) and the content inside the content tag. I want it to be hidden until the checkbox is checked.

I found a tutorial at driftingruby.com that shows how to set it up. The only thing I can guess is that maybe turbo links are needed for this work? I am disconnected because I use olark.

When I check the console for errors, I see this, which seems relevant:

 [Error] Failed to load resource: the server responded with a status of 404 (Not Found) (underscore-min.map, line 0)

I should also add that I tried everything that was asked in response to my previous question on this problem, but could not find a solution: Rails 4 - JS for dependent fields with a simple form

Can anyone see what I did wrong?

+8
javascript jquery ruby-on-rails
source share
2 answers

What you experience is a comparison of sources. This allows you to debug readable code in browser developer tools when working with mini-JS files.

The miniature version of Underscore has this line at the end of the file:

 //# sourceMappingURL=underscore-min.map

Your browser developer tools will try to load underscore-min.map when they encounter this line.

If you want to get rid of the error, follow these steps:

  • Remove this line from underscore-min.js
  • Add underscore-min.map and underscore.js to the project.
+1
source share

Have you also added minimum cards for the provider?

Source maps are used to debug javascript in your browser.

You can also download it on the bottom js label: where it says

source map

or: http://underscorejs.org/underscore-min.map

See also: Rails Assets - 404 with .map extension

0
source share

More articles:


All Articles