36

I have no idea why this is not working, I'm learning rails and I'm following a book it says to do it like this:

    <%= form_for([@article,@article.comments.new ], :remote=>true, :html => {:style=>'display: none;' }) do |f|%>
    <div class="field">
      <%=    f.label :name %>
      <%=    f.text_field :name %>
    </div>
    <div class="field">
      <%=    f.label :email %>
      <%=    f.text_field :email %>
    </div>
    <div class="field">
      <%=    f.label :body %>
      <%=    f.text_area :body %>
    </div>
    <%= f.submit %>
<% end %>

However it does not work, and when I check the request in firebug the url doesnt end in .js, do you have any ideas why?

nathanvda
  • 49,707
  • 13
  • 117
  • 139
ryudice
  • 36,476
  • 32
  • 115
  • 163
  • can you add according controller-methods (e. g. index, create, new) and the related view files here, so we can see the whole picture ? – Ingo Jun 04 '11 at 16:43

8 Answers8

36

When you check the request made in firebug, just because the url did not end with .js, it does not mean that it was not called from javascript. To verify that you should check the request header to see what the Accept parameter is. If it says "application/javascript" then it's all good.

Secondly, a very common problem when starting to try out the :remote => true is that the required javascript libraries are not included in your code. So my guess is that the following code is missing from your layout:

<%= javascript_include_tag :defaults %>
<%= csrf_meta_tag %>

If that is the case, just include it inside the <head> tag of your layout.

DanneManne
  • 21,107
  • 5
  • 57
  • 58
  • do you mean by "html header" the head tag of the template where the form/link with the remote:true is? – Timo May 18 '14 at 06:29
  • Yes, thank you for pointing it out. That was not so clear. But yes, it should be included inside to tag – DanneManne May 20 '14 at 04:26
22

Most likely what happens is that you are missing the rails.js file, which handles that for you, whether you are using prototype or jquery.

If you are using jQuery, the easiest way to get all the needed files is using the jquery-rails gem. This will add a generator to install jquery and the needed rails.js.

type something like inside your rails application root:

rails g jquery:install

And then, inside your application.html.erb add the line

<%= javascript_include_tag :defaults %>

or explicitly (do not forget to include your jquery separately):

<%= javascript_include_tag :rails, :application %>

[EDIT: for Rails 3.1 or greater using the asset pipeline]

Use the jquery-rails gem (as mentioned above) and add the following lines to the app/assets/javascripts/application.js (if they are not there already) :

//= require jquery
//= require jquery_ujs

Hope this helps!

nathanvda
  • 49,707
  • 13
  • 117
  • 139
7

Check your /app/assets/javascript/application.js file

It should be included below files in there. jquery_ujs is responsible for working remote=> true feature.

require `jquery`
require `jquery_ujs`

Happy Coding!!

Manish Shrivastava
  • 30,617
  • 13
  • 97
  • 101
  • 1
    I had a similar newbie issue while following `Agile Web Development with Rails`, on `chapter 11.2 Iteration F2: Creating an AJAX-Based Cart`. The problem is solved by uncomment `= require jquery` in the file your listed. Hope this helps for other people. – digit plumber Feb 24 '16 at 07:33
  • That's Great @cppinitiator! – Manish Shrivastava Feb 25 '16 at 11:53
7

This error occurs when you have not add jquery_ujs file. You just included the jquery file.

So you need to add both files manually in you view or require them in application.js or any other file which you are using for specific layout.

Depending upon your scenario, you can follow 1st or 2nd solution.

1st solution:

<%= javascript_include_tag :jquery, :jquery_ujs %>

2nd solution:

  1. Require both jquery and jquery_ujs in app/assets/application.js

    //= require jquery.js

//= require jquery_ujs

  2. Include application.js file in your specific layout file. 

    <%= javascript_include_tag :application %>

Note:

Also add csrf tag in layout file for both solutions.

<%= csrf_meta_tag %>

I'm asuming that you have below code in your Gemfile and already installed this Gem.

gem 'jquery-rails'
Taimoor Changaiz
  • 10,250
  • 4
  • 49
  • 53
4

Check the controller: does it have a respond_to block?

If you generated your app with rails generate scaffold, it will have something like

    respond_to do |format|
      format.html
      format.xml  { .... }
    end

If it does have it, just take the whole block out, from respond_to to end; or alternatively replace the whole block with the single line

    respond_to :html, :js

or alternatively edit the block by adding the extra line shown here

    respond_to do |format|
      format.html
      format.js
      format.xml  { .... }
    end

Either should work in your case.

Andrea
  • 420
  • 2
  • 8
1

If you have a file_field then it submits as html, even when remote: true - took me a long time to work that out so I am adding this answer to maybe save someone else time, there is a solution, use the remotipart gem, see the answer here

ryan2johnson9
  • 724
  • 6
  • 21
1

If none of the above answers solve it for you, double check if you are not rendering your remote: true (or local: false) form nested within another form in the page. This was causing the issue for us.

sandre89
  • 5,218
  • 2
  • 43
  • 64
-11

Change: 

[@article,@article.comments.new ]

for 

@article

I suggest you reading the API on the related section : http://api.rubyonrails.org/classes/ActionView/Helpers/FormHelper.html

vidriloco
  • 71
  • 1
  • 5
  • 2
    ryudice is looking to have a new comments form for the article ryudice is on. ryudice's form_for call is the correct syntax for what ryudice is wanting. Your suggestion would be fine for a standard article form. It's confusing, because the context is never stated. – natedavisolds Jun 04 '11 at 23:56