レール：（リモート、 "例" のlink_to、 "＃"：真）作る：私は2つのリモートリンクを持っている私のページで</p> <p>バイパス（respond_to ... format.js）

Question

私は次のような問題があります。最初は、次のとおり

fadeToggleに単純なリンクオブジェクトの記述である

<p><%= link_to "Description", "#", remote: true, id: "desc-link" %></p> 

：

$(document).on "ready page:load", -> 
    $("section.object").on "click", "#desc-link", -> 
    $("#object-desc").fadeToggle() 

第一方はAjax呼び出しである：

<a type="button" class="btn btn-default", 
    href='/users/<%= Object.find(object_to_display).user.id %>/objects', 
    data-remote="true" id='object-link'>Test</a> 

及びコントローラでありますクリックしたときにSTUFFを実行するはずだった：

def objects 

    ... 

    respond_to do |format| 
    format.html { render "users/show_objects" } 
    format.js { STUFF } 
    end 
end 

私の問題は、最初のリンクを使用して説明をオンまたはオフに切り替えるたびに、STUFFが発生し、そのようなことは想定されないことです。最初のリンクをクリックしてSTUFFが起きるのを避けるにはどうすればいいですか？

Answer 1

最初のリンクはremote: trueを必要としません。 jquery_ujsをクリックすると、自動的にajax経由でリンクが送信されます。 remote: trueを削除すると、トグルリンクがobjectsアクションを引き起こさないようにする必要があります。

別に、あなたのclickハンドラが（「私はそれを処理し、このクリックを無視する」基本的にブラウザを言っている）falseを返すか、リンクをたどるしようとしてからブラウザを防ぐためにe.preventDefault()を呼び出す必要があり、次のいずれか

$(document).on "ready page:load", -> 
    $("section.object").on "click", "#desc-link", (e) -> 
    $("#object-desc").fadeToggle() 
    e.preventDefault() // <-- prevents following the link