Rails 3.1: Adding & Removng fields with dynamically jQuery (Railscasts #197)

Question

Rails noob here.
I've been searching on Google and StackOverflow for information in order to get the example used in Railscasts #197 to work but none of the links i've visited work with Rails 3.1!
When I click on the remove or add new fields button absolutely nothing happens. This is so frustrating :/

Anyone know why the code I've provided below isn't adding fields or removing fields dynamically like in the RailsCasts episode?

application_helper.rb

def link_to_remove_fields(name, f)
f.hidden_field(:_destroy) + link_to_function(name, "remove_fields(this)")
end 

def link_to_add_fields(name, f, association)
new_object = f.object.class.reflect_on_association(association).klass.new
fields = f.fields_for(association, new_object, :child_index => "new_#{association}") do    |builder|
    render(association.to_s.singularize + "_fields", :f => builder)
 end 
    link_to_function(name, "add_fields(this, '#{association}', '#    {escape_javascript(fields)}')", :remote => true)
 end

app.js

// delete characters on users#edit and users#new
function remove_fields(link) {
$(link).prev("input[type=hidden]").val("1");
$(link).closest("#character").hide();
}

// add character fields on users#edit and users#new
function add_fields(link, association, content) {  
    var new_id = new Date().getTime();  
    var regexp = new RegExp("new_" + association, "g");  
    $(link).parent().before(content.replace(regexp, new_id));  
}

html

<div id="account">
<div class="field">
    <%= f.label :account_name %><br />
    <%= f.text_field :account_name %>
</div>
<div class="field">
    <%= f.radio_button(:realm, "USWest") %>
    <%= f.label(:realm, "USWest") %>

    <%= f.radio_button(:realm, "USEast") %>
    <%= f.label(:realm, "USEast") %>

    <%= f.radio_button(:realm, "Europe") %>
    <%= f.label(:realm, "Europe") %>

    <%= f.radio_button(:realm, "Asia") %>
    <%= f.label(:realm, "Asia") %>
</div>      
<div class="field">
    <%= link_to_add_fields "Add new account", f, :characters %>
</div>

<div class="field"> 
    <%= f.hidden_field :_destroy %>
     <%= link_to_remove_fields "remove", f %>
</div>
<%= f.fields_for :characters do |builder| %>
<%= render "characters/char_fields", :f => builder %>
<% end %>
</div>

apneadiving · Accepted Answer · 2011-08-01 12:49:38Z

1

I can't see the necessary partial called by:

render(association.to_s.singularize + "_fields", :f => builder)

answered Aug 1, 2011 at 12:49

apneadiving

116k26 gold badges225 silver badges215 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

imjp Over a year ago

I changed the code slightly when pasted it to prevent pasting extra code but the partials are being displayed fine in the app. It's the functions in the apphelper.rb and app.js that have issues :(

ne.hannah · Accepted Answer · 2011-09-03 05:33:15Z

Ok, first you need to make sure you are using the correct rails 3.1 include tag for the application.js file in the head of your application.html.erb file. In the screen cast he uses the old way:

<%= javascript_include_tag :defaults, :cache => true %>

The new way is:

<%= javascript_include_tag "application" %>

Now in said application.js file you will now see the bellow code, don't delete this, the comments are used in the asset pipeline to include jquery which is the now bundled with rails in place of prototype.js.

// This is a manifest file that'll be compiled into including all the files listed below.
// Add new JavaScript/Coffee code in separate files in this directory and they'll automatically
// be included in the compiled file accessible from http://example.com/assets/application.js
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// the compiled file.
//
//= require jquery
//= require jquery_ujs
//= require_tree .

It looks like your code is set for jquery already so if you want to make it easy just append that code to the bottom of the application.js file under the comments and you should be set.

Collectives™ on Stack Overflow

Rails 3.1: Adding & Removng fields with dynamically jQuery (Railscasts #197)

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related