Reputation: 2859
Rails is outputting my articles partial twice. Currently, I just loop through the articles collection and output it. At first I believed it was a problem with AJAX but I deleted all of the javascript in the application.js and the index.js.erb files and it still repeats twice. I've also checked the database by logging in through Rails c and running Articles.all.count
and that returns the correct # of articles. I've also reset the db and tried it again with the same result.
article#index
<h1 class="text-center">talks</h1>
<div id="articles-list" class="small-12 small-centered columns">
<%= render @articles %>
</div>
<%= will_paginate @articles %>
_article.html.erb partial:
<% @articles.each_with_index do |article, index| %>
<%= index %>
<dl class="individual-article">
<dt><%= article.title %>
<% if current_user.try(:admin) %>
| <%= link_to 'Edit', edit_article_path(article) %>
<% end %><br>
<%= raw article.tags.map(&:name).map { |t| link_to t, tag_path(t), class: get_class(t) }.join(', ') %>
</dt>
<dd><%= truncate(article.body.html_safe, length: 200) %>
<%= link_to 'more', article_path(article) %>
</dd>
</dl>
I put the index on to capture if it's repeating and it is. If I have three articles it will output 0 1 2 0 1 2 for the indeces. So I know it's getting executed twice.
article controller
def index
if params[:tag]
@articles = Article.tagged_with(params[:tag]).order('created_at DESC').paginate(page: params[:page], per_page: 3)
else
@articles = Article.order('created_at DESC').paginate(page: params[:page], per_page: 3)
end
end
I have some AJAX for infinite scrolling which may be the problem. Except if I delete the entire js file, it has the same behavior.
index.js.erb
$('#articles-list').append('<%= escape_javascript render(@articles) %>');
$('.pagination').replaceWith('<%= escape_javascript will_paginate(@articles) %>');
Application.js
$(document).ready(function() {
if ($('.pagination').length) {
$(window).scroll(function() {
var url = $('.pagination .next_page').attr('href');
if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50) {
$('.pagination').text("Please Wait...");
return $.getScript(url);
}
});
return $(window).scroll();
}
});
I'm relatively new to Rails and would appreciate advice on how to prevent this from executing twice.
Edit
Partial server logs:
...
Article Load (0.2ms) SELECT "articles".* FROM "articles" ORDER BY created_at DESC LIMIT 3 OFFSET 0
...
Rendered articles/_article.html.erb (6.5ms)
Rendered articles/index.html.erb within layouts/application (12.8ms)
Rendered layouts/_header.html.erb (0.4ms)
Upvotes: 4
Views: 2558
Reputation: 5528
You are passing a collection to the partial. This will render the partial one time for each element in @articles. In the partial you then loop again on @articles. Take the loop outside the partial or delete it if you don't need the index. These will both work:
article#index
<div id="articles-list" class="small-12 small-centered columns">
<% @articles.each_with_index do |article, index| %>
<%= render 'article', article: article, index: index %>
<%end%>
</div>
_article.html.erb partial:
<%= index %>
<dl class="individual-article">
<dt><%= article.title %>
<% if current_user.try(:admin) %>
| <%= link_to 'Edit', edit_article_path(article) %>
<% end %><br>
<%= raw article.tags.map(&:name).map { |t| link_to t, tag_path(t), class: get_class(t) }.join(', ') %>
</dt>
<dd><%= truncate(article.body.html_safe, length: 200) %>
<%= link_to 'more', article_path(article) %>
</dd>
</dl>
or if you don't need the index in the partial, keep index.html as it is right now and just remove the loop from the partial:
_article.html.erb partial:
<dl class="individual-article">
<dt><%= article.title %>
<% if current_user.try(:admin) %>
| <%= link_to 'Edit', edit_article_path(article) %>
<% end %><br>
<%= raw article.tags.map(&:name).map { |t| link_to t, tag_path(t), class: get_class(t) }.join(', ') %>
</dt>
<dd><%= truncate(article.body.html_safe, length: 200) %>
<%= link_to 'more', article_path(article) %>
</dd>
Upvotes: 8