Muhammad Yaseen Muhammad Yaseen - 1 month ago 8
jQuery Question

Scroll bar jumps back to the top when the hide link is clicked

Actually I have got a more number of records in my index page with respective "hide"link on each record. Then problem is when I click the respective link it hides the record but moves to the top of the page, how do I stop this?

_rak361.html.erb

<%= link_to "Hide", hide_rak361_path(rak361), method: :put, class: 'stopper', style: "color:#ccc;" %>


ample.js

$( document ).ready(function() {

$(".stopper").click(function(event) {
event.preventDefault();
});

});


rak361s_controller.rb

def hide
@rak361 = Rak361.find(params[:id])
@rak361.hide
flash[:notice] = 'Rak361 was successfully hidden.'
redirect_to rak361s_url
end


I have tried but it is not working for me.

Any suggestions are most welcome.

Thank you in advance.

RSB RSB
Answer

Thats because its a full page reload, first thing you need to to do is to use path helpers instead of mentioning controller and action in link_to, and the second thing is you should use remote: true option to ajaxify the request. Here's an example

= link_to "Hide", example_hide_path(id), method: :put, remote: true, class: 'stopper', style: "color:#ccc;"

Either you can use remote: true, or you can send an ajax request using jQuery's $.ajax().

Hope that helps!