了解Rails 3中的Ajax

Question

I thought I understood Ajax in Rails 3 to a point but think I am confusing myself somewhere or misinterpreted something. My understanding is that if I want to call different content on the same page then i create a js.erb file for that particular action. For example if i have an action of tynewyddnews, I will have an tynewyddnews view and a tynewyddnews.js.erb file.

I then create a partial to render on that page and call that partial in my .js.erb file.

Example

View

<% @tynewyddpost.each do |t| %>
  <li>
    <% single = t.photos.first %>
    <a class="photo" href="#"><%= image_tag(single.avatar.url(:thumbnail_news_images)) %></a>
    <p><%= link_to t.title, tynewyddnews_path(:type => 'tynewyddnews'), :post_id => t.id, :remote => true %></p>
    <p class="date"><%= date_output(t.published_on) %></p>
  </li> 
 <% end %>

    <div class="post-item">
  <h2><%= @tynewyddpostlatest.title %></h2>
   <div id="work-samples"> 
    <% for photo in @tynewyddpostlatest.photos %>
     <%= image_tag(photo.avatar.url(:news_images), :class => 'work-sample') %>
   <% end %>
   </div>  
    <p class="post-description"><%= @tynewyddpostlatest.comments.html_safe %></p><a class="post-more" href="#">Continue Reading&nbsp;&raquo;</a>
    <div class="post-item-panel">
     <ul>
      <li class="date">
       <p><%= date_output(@tynewyddpostlatest.published_on) %></p>
     </li>
    </ul>
   </div>
  </div>

So the historical posts go down the left hand side and the latest post goes in the center

.js.erb

<% if params[:type] == 'tynewyddnews' %>
   jQuery('.post-item').html('<%= escape_javascript(render partial: 'tynewyddnewspost') %>');
<% end %>

Partial

<div class="post-item">
 <h2><%= @tynewyddpost.title %></h2>
  <div id="work-samples"> 
   <% for photo in @tynewyddpost.photos %>
    <%= image_tag(photo.avatar.url(:news_images), :class => 'work-sample') %>
   <% end %>
  </div>  
  <p class="post-description"><%= @tynewyddpost.comments.html_safe %></p>
   <div class="post-item-panel">
      <ul>
       <li class="date">
        <p><%= date_output(@tynewyddpost.published_on) %></p>
       </li>
      </ul>
  </div>
</div>

Controller

def tynewyddnews
tynewyddpost = Post.tynewydd_posts.find(params[:post_id])
tynewyddpost.shift
@tynewyddpost = tynewyddpost
@tynewyddpostlatest = Post.tynewydd_posts.first
end

tynewydd_posts is a scope

scope :tynewydd_posts, :include => :department, :conditions => {"departments.name" => "Ty Newydd"}, :order => "posts.published_on DESC"

So my issue at the moment is when i try and render the page i get the error

Couldn't find Post without an ID

Apologies for the long post but if someone could point me in the right direction that would be great

Thanks

Answer 1

It looks to me like you're doing it way wrong, sorry. It doesn't need to be that complicated. I would start over from scratch with a much simpler example, and then build up from there.

I would do something like rails g scaffold post title:string and then do this, just in a browser console:

$.ajax({
  url: "/posts/index"
}).done(function() {
  console.log("done");
});

You should be able to see the data coming back through your browser's console. On the Rails side, that data is coming from here:

class PostsController < ApplicationController
  def index
    @posts = Post.all
    # there might be more stuff here
  end
end

Hopefully you understand what I'm talking about. If you don't, I'd recommend separately learning a little more about Rails and a little more about jQuery/ajax before trying to combine the two.