1

Basically, I have my messages inbox (using mailboxer gem) arranged in a collapsible accordion (using twitter bootstrap). Whenever a user clicks on a conversation, it expands and shows all the messages. I want it so that when the user clicks on the conversation, it also marks the conversation as read.

I followed the instructions here to try to do what I want it to do: How to call a rails method from in jQuery

I basically tried to reference the "a data-toggle=......"by putting an id in there and then running a jquery script that gets a render_read path I created in my controller whenever I click something in between the "a data-toggle=....." and "/a" tags (stakoverflow won't let me carrot the a's..)

It's not working though....please help, I've been trying to solve this problem for the past day....I'm also relatively new at rails.

_conversation.html.erb (Mailboxer uses this to render each conversation when I run mailbox.inbox)

<div class="panel panel-default" >
        <div class="panel-heading">  
        <h3 class="panel-title">
            <a data-toggle="collapse" data-parent="#accordion" href= "#collapse_<%= conversation.id %>" id= "click_<%= conversation.id %>">

            <strong><%= conversation.subject %> </strong>

          </a>
        </h3>
        </div>

         <div id="collapse_<%= conversation.id %>" class="panel-collapse collapsing">
        <div class="panel-body">
            <%= content_tag_for(:ul, conversation.receipts_for(current_user)) do |receipt| %>
            <% message = receipt.message %>
            <% t = message.updated_at.localtime %>
             <div class="row">
             <div class="col-md-7"><strong><%= message.sender.first_name %>: </strong><%= message.body %></div>
             <div class="col-md-5">Sent <%= t.strftime("%a, %m/%e/%Y %I:%M %p") %></div>
             </div>
                <% end %>
                <%= render 'messages/form', conversation: conversation %>
            </div>
          </div>
</div>

I run this script at the bottom of this file

 <script>$("#click_<%= conversation.id %>").click(function() {$.ajax("/conversations/render_read")});</script>

My conversations controller has in public section

  def render_read
   conversation.mark_as_read(current_user)
  end 

My routes.rb has

resources :conversations, only: [:index, :show, :new, :create] do
 member do
   post :reply
   post :trash
   post :untrash
   get :render_read
 end
end
Community
  • 1
  • 1

2 Answers2

0

It's happening due to turbolinks, you need to insert data-turbolinks-eval=false in scrpt tag to make it work

<script data-turbolinks-eval=false>$("#click_<%= conversation.id %>").click(function() {$.ajax("/conversations/render_read")});</script>
Rajdeep Singh
  • 17,621
  • 6
  • 53
  • 78
  • I tried this, it's still not working. I also tried adding a "data-no-turbolink" attribute to the a href tag, doesn't help though. – user3321224 May 23 '14 at 14:07
0

First of all you should include your jquery in a separate file, read this article for asset pipeline. To answer your question you can either do what @RSB has suggested or you instead you can use jquery "on" event, something like this:

$(document).on("click","#test",function(){
  // your code
});

Checkout my answer here, it lists some more solutions to your problem.

Community
  • 1
  • 1
Mandeep
  • 9,093
  • 2
  • 26
  • 36
  • I know it's not best practices but for small bits,especially since I don't have any other jquery code, I like to have it just as a script on the bottom of the same page (does this create a functional problem though?). Also, I tried both the .on and .live events, still not working though... – user3321224 May 23 '14 at 14:11