Problem with AJAX and UJS with jQuery in Rails 3

Question

I am trying to get this working by following the tutorial at:

http://net.tutsplus.com/tutorials/javascript-ajax/using-unobtrusive-javascript-and-ajax-with-rails-3/

and the railscast at

http://railscasts.com/episodes/205-unobtrusive-javascript

..in both cases I am having the same problem. The controller is not rendering the .js template (it is falling back to .html) because the request header isn't requesting javascript like it should be.

I am using the jquery ujs from github and jquery 1.4.4

The "data-remote=true" attribute is being supplied to the form like it is supposed to be. But for some reason this isn't modifying the request.

If I switch to prototype.js it works (with the default prototype.js and rails.js from rails).

I am using rails 3.0.0

Any suggestions appreciated.

Gaylagayle

Does this happen in all browsers or just a certain one? – Goodall

please can you post some example code, like the controller action you're using to render the template – Whap

Can you show use the errors in the javascript console inside your browser (in chrome or firebug in firefox). – Toxinantitoxin

Monocle: it behaves as I indicated in my question slightly differently in FF vs Safari, only in the sense that the request accept is not the same. But either way it's not text/javascript, like it is supposed to be. – Gaylagayle

Scaney..my controller code is just as it is in the screen cast and article that I linked to. One line: format.js. But this doesn't really matter as THE REQUEST ACCEPT that is being sent is WRONG. If that is not text/javascript..the controller is not going to pay any attention to the format.js and it's not going to use the .js template. – Gaylagayle

Nathanvda: there are no errors in the javascript console. There are no javascript errors at all. The data-remote=true is supposed to cause the accept portion of the request header to be set to text/javascript (whether it's an anchor link or a form being submitted). That is what is not happening. The js library (jquery and jquery-ujs in this case) is supposed to make this happen. I tried to trace the .js to see where it might be going wrong but I was unable to find the problem. – Gaylagayle

Answer 1

After wasting a day...:-(

I found that When you generate a new Rails 3 application, a file called rails.js is created in the public/javascripts folder along with all the other .js files you are used to see in a Rails 2 project.

rails.js contains all the unobtrusive handlers. By default, Rails assumes you are using Prototype.js .

For Jquery replace the file rails.js with https://github.com/rails/jquery-ujs

The below link helped me: http://www.simonecarletti.com/blog/2010/06/unobtrusive-javascript-in-rails-3/

Naze

Rakesh, I said right in my question that I had replaced the rails.js with the jquery-ujs). – Gaylagayle

Answer 2

The "current" best way to handle this is to add this puppy to your gemfile

https://github.com/indirect/jquery-rails

run

bundle install

then

rails generate jquery:install #--ui to enable jQuery UI --version to install specific version of JQuery (default is 1.4.2)

then you're all set - it overwrites the default rails.js when you run the generator.

Metaplasia

Answer 3

I had similar issues.Then, i decided since the problem was with Ajax, i should start with something very simple.So, i started with This

Chickaree