When installing JQuery, why does my "delete" link break?

Question

I have a Rails 3 application that can create and delete products. An index page lists all the products. Next to each product in the list is a delete link:

<%= link_to "Delete", product, :method => :delete, :title => "Delete" %>

This looks like this in the HTML:

<a href="/products/104" data-method="delete" rel="nofollow" title="Delete">Delete</a>

This has been working fine.

I've reached the point where I want to install JQuery in my application. I followed the steps available on several web pages (like this or this, for example).

After installing JQuery, the above "delete" link breaks. Instead of processing the destroy action in ProductsController, Rails attempts to process the show action!

My guess is that it has something to do with the fact that web browsers can’t send DELETE requests natively, so Rails "fakes" such requests with JavaScript, which is why I had the following line before attempting the JQuery install:

<%= javascript_include_tag :defaults %>

Edit: Something during the JQuery install must have made it such that the Javascript used to "fake" the DELETE request no longer works, resulting in the show action being called. But what exactly is happening I don't know...

Anyone have any ideas? Thank you.

Answer 1

Double-check the order that your JavaScript files are being included. Specifically, jQuery must be loaded before the jQuery Rails driver (see the following lines at http://github.com/BinaryMuse/rails-book/blob/master/app/views/layouts/application.html.haml#L6-L7):

<%= javascript_include_tag "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" %>
<%= javascript_include_tag "rails" %>

(This assumes you replaced the content in rails.js with the jQuery driver from http://github.com/rails/jquery-ujs/blob/master/src/rails.js).