Mike G
Mike G

Reputation: 751

Rails 4 coffeescript click not working

I know this question is beaten to death on SO but I tried all possible approaches but nothing seems to work for me. I am trying to add a simple alert when a link is clicked. Appreciate your inputs on this.

All it does

View partial: (I am want to fire some coffeescript on click of the Cancel link with id:"cancel-comment)

<%= simple_form_for [@parent,@comment] do |f| %>
  <%= f.error_notification %>

  <div class="form-inputs">
    <%= f.hidden_field :group_id, :value => @group_id %>
    <%= f.input :body, placeholder: 'Reply', label: false %>
  </div>

  <div class="form-actions">
    <%= f.button :submit, 'Post Reply'%>
  </div>
  <%= link_to "Cancel", "#",id: "cancel-comment" %>

<% end %>

coffeescript: assets/comments.coffee:

$(document).on "page:change" , ->
  $('#cancel-comment').click ->
    alert "page has loaded!"
    return false

I also tried this:

$(document).on "page:change", ->
   $('#cancel-comment').click(e) ->
     e.preventDefault()
     alert "page has loaded!"

I also tried replacing the coffeescript with javascript as below but that didn't seem to help too:

$(document).on("page:change", function() {
    $('#cancel-comment').click(function(event) {
      event.preventDefault();
      alert("page has loaded!");
    });
  });

gemfile:

gem 'jquery-turbolinks'

assets/application.js

//= require jquery
//= require jquery_ujs
//= require jquery.turbolinks
//= require twitter/bootstrap
//= require turbolinks
//= require_tree .

Upvotes: 2

Views: 1299

Answers (1)

Richard Peck
Richard Peck

Reputation: 76784

$(document).on "click", "a#cancel-comment", (e)->
  e.preventDefault()
  alert "page has loaded!"

Whenever we bind events to elements with Turbolinks, we delegate from the document and bind to the element directly.

--

If you're using Rails 5, you'll find that Turbolinks has changed its event hooks

Upvotes: 3

Related Questions