Call voting method, without refreshing page. Using Thumbs_Up gem and Rails

Question

I've been struggling with this for a couple of hours now and I simply can't get past how I'm supposed to do it. I know there's been several people writing on same topic or similar, but it hasn't helped. Hope you can help me.

I'm trying to make a voting system on a site I'm doing and I'm usign the gem Thumbs_Up for it. It's working fine, besides it's reloading the site each time I vote for something.

My images_controller.rb is like this:

def vote_up
begin
  current_user.vote_for(@image = Image.find(params[:id]))
  render :nothing => true, :status => 200
rescue ActiveRecord::RecordInvalid
  render :nothing => true, :status => 404
end
end

My index.html.erb is like this:

<%= link_to('vote for this post!', vote_up_image_path(image)) %>

And I'm trying with some javascript, but it's not working:

$(".shotBG a").click(function(){
    $.ajax({
        type: 'PUT',
        url: "http://localhost:3000/images/37/vote_up",
        success: function(){
            alert("hello");
        }   
    });
    return false;
});

Hope you can help a noob out :-).

UPDATE

The full code for the view is:

<% @images.each do |image| %>
    <li class="shotBG bottomShots">
        <img class="shot" src="<%= image.uploaded_file.url %>" alt="Competing for dribbble invites." />
        <%= link_to('vote for this post!', vote_up_image_path(image)), :remote => true, :method => :post %>
    </li>
<% end %>

That might have something to do with the compile error?

UPDATE 2

Forgot to show my route-file:

resources :images do
    member do
        post :vote_up
    end
end

UPDATE 3

Rake route:

browse        /browse/:folder_id(.:format)            {:action=>"browse", :controller=>"home"}
       vote_up_image POST   /images/:id/vote_up(.:format)           {:action=>"vote_up", :controller=>"images"}
              images GET    /images(.:format)                       {:action=>"index", :controller=>"images"}
                     POST   /images(.:format)                       {:action=>"create", :controller=>"images"}
           new_image GET    /images/new(.:format)                   {:action=>"new", :controller=>"images"}
          edit_image GET    /images/:id/edit(.:format)              {:action=>"edit", :controller=>"images"}
               image GET    /images/:id(.:format)                   {:action=>"show", :controller=>"images"}
                     PUT    /images/:id(.:format)                   {:action=>"update", :controller=>"images"}
                     DELETE /images/:id(.:format)                   {:action=>"destroy", :controller=>"images"}
             folders GET    /folders(.:format)                      {:action=>"index", :controller=>"folders"}
                     POST   /folders(.:format)                      {:action=>"create", :controller=>"folders"}
          new_folder GET    /folders/new(.:format)                  {:action=>"new", :controller=>"folders"}
         edit_folder GET    /folders/:id/edit(.:format)             {:action=>"edit", :controller=>"folders"}
              folder GET    /folders/:id(.:format)                  {:action=>"show", :controller=>"folders"}
                     PUT    /folders/:id(.:format)                  {:action=>"update", :controller=>"folders"}
                     DELETE /folders/:id(.:format)                  {:action=>"destroy", :controller=>"folders"}
                     GET    /images(.:format)                       {:action=>"index", :controller=>"images"}
                     POST   /images(.:format)                       {:action=>"create", :controller=>"images"}
                     GET    /images/new(.:format)                   {:action=>"new", :controller=>"images"}
                     GET    /images/:id/edit(.:format)              {:action=>"edit", :controller=>"images"}
                     GET    /images/:id(.:format)                   {:action=>"show", :controller=>"images"}
                     PUT    /images/:id(.:format)                   {:action=>"update", :controller=>"images"}
                     DELETE /images/:id(.:format)                   {:action=>"destroy", :controller=>"images"}
    new_user_session GET    /users/sign_in(.:format)                {:action=>"new", :controller=>"devise/sessions"}
        user_session POST   /users/sign_in(.:format)                {:action=>"create", :controller=>"devise/sessions"}
destroy_user_session DELETE /users/sign_out(.:format)               {:action=>"destroy", :controller=>"devise/sessions"}
       user_password POST   /users/password(.:format)               {:action=>"create", :controller=>"devise/passwords"}
   new_user_password GET    /users/password/new(.:format)           {:action=>"new", :controller=>"devise/passwords"}
  edit_user_password GET    /users/password/edit(.:format)          {:action=>"edit", :controller=>"devise/passwords"}
                     PUT    /users/password(.:format)               {:action=>"update", :controller=>"devise/passwords"}

cancel_user_registration GET /users/cancel(.:format) {:action=>"cancel", :controller=>"devise/registrations"} user_registration POST /users(.:format) {:action=>"create", :controller=>"devise/registrations"} new_user_registration GET /users/sign_up(.:format) {:action=>"new", :controller=>"devise/registrations"} edit_user_registration GET /users/edit(.:format) {:action=>"edit", :controller=>"devise/registrations"} PUT /users(.:format) {:action=>"update", :controller=>"devise/registrations"} DELETE /users(.:format) {:action=>"destroy", :controller=>"devise/registrations"} root / {:action=>"index", :controller=>"home"} new_sub_file /browse/:folder_id/new_file(.:format) {:action=>"new", :controller=>"images"} new_sub_folder /browse/:folder_id/new_folder(.:format) {:action=>"new", :controller=>"folders"} rename_folder /browse/:folder_id/rename(.:format) {:action=>"edit", :controller=>"folders"}

Hiya, this might help: http://stackoverflow.com/questions/4907744/clarification-on-how-to-use-thumbs-up-voting-gem-with-rails-3 cheers! — Tats_innit, Mar 18 '12 at 20:26
Been there, done that :-). That posts helped me to get it to work, but it's refreshing the page when you vote and that's not very practical. — Holger Sindbaek, Mar 18 '12 at 20:39
:) Saweet mate! refreshes the page even though its an ajax call hmm .. so issue is with in ajax - by any chance can this be jsfiddle (i doubt ) or a working sample, For URL try relative path, cheerios! — Tats_innit, Mar 18 '12 at 20:52

Nash Bridges · Answer 1 · 2012-03-18T21:39:47.853

2

If you want to send an AJAX request, you have to use remote: true in url helper:

<%= link_to('vote for this post!', vote_up_image_path(image), :remote => true, :method => :post) %>

edited Mar 18 '12 at 21:39

answered Mar 18 '12 at 20:55

Nash Bridges

2,350
14
19

Then I just get a compile error at the line of the link: /Users/holgersindbaek/Projekter/Seriously Mobile/Flow/app/views/images/index.html.erb:12: syntax error, unexpected ',', expecting ')' ...', vote_up_image_path(image)), :remote => true, :method => :... – Holger Sindbaek Mar 18 '12 at 21:26
@HolgerEdwardWardlowSindbæk Indeed, I've corrected parenthesis. – Nash Bridges Mar 18 '12 at 21:41
Just made a little update... can that have something to do with the compile error? – Holger Sindbaek Mar 18 '12 at 21:41
Great... that got rid of the compile-error. It's still not upvoting in the database though. Any suggestions? Is the jquery wrong? Is it even the right way to do it? – Holger Sindbaek Mar 18 '12 at 21:45
If I take the return false; out of the jquery, it seems to be logging me out after I refresh. Why does it do that? Can that have something to do with it? – Holger Sindbaek Mar 18 '12 at 21:48
@HolgerEdwardWardlowSindbæk You don't need any additional jQuery, only `:remote => true` in a link helper. Maybe you have to use `:method => :put`? Please paste an output of your `rake routes` – Nash Bridges Mar 18 '12 at 21:52
I've tried with :method => :put as well and it doesn't seem to be functioning. How do I get the output of my rake routes? I'm also a bit in doubt, is I should have get or post in the route? – Holger Sindbaek Mar 18 '12 at 21:58
Run `rake routes` in a console within your project directory and copypaste an output. – Nash Bridges Mar 18 '12 at 22:00
Added the rake-routes and the routes above – Holger Sindbaek Mar 18 '12 at 22:03
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/9022/discussion-between-nash-bridges-and-holger-edward-wardlow-sindbaek) – Nash Bridges Mar 18 '12 at 22:06

score 0 · Accepted Answer · answered Mar 19 '12 at 13:48

0

After a long talk to Nash, I ended up creating a new project. Everything was to messy. THanks for the helpe Nash.

answered Mar 19 '12 at 13:48

Holger Sindbaek

2,278
6
41
68

Call voting method, without refreshing page. Using Thumbs_Up gem and Rails

2 Answers2