0

Hey I'm trying to add endless scrolling to a rails app...i followed the tutorial by ryan bates but im still having some trouble getting the next page content to load.

So you get a clue about the structure im using...i have a controller called Static Pages which mainly has static pages plus a few other nonstatic pages...one of those pages is called 'feed' so within the static_pages view i have a feed.html.erb

It's a feed page that shows users updates

here is the controller (static_pages)

def feed
  if signed_in?
    @update = current_user.updates.build
    @feed_items = current_user.feed.page(params[:page]).per_page(5)
  else
    flash[:error] = "Please sign in."
    redirect_to login_url
  end

  respond_to do |format|
    format.js
    format.html
  end
end

here is the feed html view

<div class="row">
  <div class="span8 offset2 settings update">
    <div id="feeds">
  <%= render partial: "shared/feed_item", collection: @feed_items %>
</div>
    <%= will_paginate @feed_items %>
  </div> 
</div>

Here is my static_pages.js.coffee (from ryan bates)

jQuery ->
  if $('.pagination').length
  $(window).scroll ->
    url = $('.pagination .next_page a').attr('href')
    if url && $(window).scrollTop() > $(document).height() - $(window).height() - 50
      $('.pagination').text("Fetching more products...")
      $.getScript(url)
  $(window).scroll()

and finally here is my feed.js.erb (in the static_pages view folder)

$('#feeds').append("<%= render partial: 'shared/feed_item', collection: @feed_items %>");
  <% if @feed_items.current_page < @feed_items.num_pages %>
  $('.pagination').replaceWith('<%= will_paginate(@feed_items) %>');
<% else %>
  $('.pagination').remove();
<% end %>

does anyone want to take a stab and try to figure out whats going on here? I'm sure it's something easy that im not seeing. (by the way, the paginate works great before i started working on the endless scrolling)

and when i try to access the feed page and scroll to the bottom, the texts (Fetching more products) does get rendered, but the new feed_items do not.

EDIT for trueunlessfalse

Static_pages coffeescript

jQuery ->
  if $('.pagination').length
    $(window).scroll ->
      url = $('.pagination .next_page a').attr('href')
      if url && $(window).scrollTop() > $(document).height() - $(window).height() - 5
        $('.pagination').text("Hello world!")
        $.getScript(url)
    $(window).scroll()

feed.html.erb

<div class="row">
  <div class="span8 offset2 settings update">
    <div id="feeds" data-no-turbolink>
  <%= render partial: "shared/feed_item", collection: @feed_items %>
    </div>
    <%= will_paginate @feed_items %>
  </div>
</div>

feed.js.erb

$('#feeds').append("<%= j render partial: 'shared/feed_item', collection: @feed_items %>");
  <% if @feed_items.next_page %>
    $('.pagination').replaceWith('<%= j will_paginate(@feed_items) %>');
  <% else %>
    $('.pagination').remove();
  <% end %>
Justin
  • 4,922
  • 2
  • 27
  • 69
  • first thing I'd check in your place are if there are any javascript errors (firebug, chrome inspector). In chrome inspector you can also enable to log xhttp requests, so you can see if the actual request fails or succeeds. 80% chance that gives you a good clue already whats wrong. – trueunlessfalse Sep 21 '13 at 20:20
  • besides, maybe this thread might help: http://stackoverflow.com/questions/18545769/will-paginate-with-endless-scrolling-rails4?rq=1 – trueunlessfalse Sep 21 '13 at 20:24
  • Yep the pages js loads fine until i hit the bottom them i get a **Failed to load resource: the server responded with a status of 500 (Internal Server Error) ** error – Justin Sep 21 '13 at 20:30
  • alright so i got the ajax to work by replacing on line of my code, but now it doesn't render the "Fetching more products" text, it renders the pagination but then starts to load the new feeds – Justin Sep 21 '13 at 20:37
  • hm, if you further need help you should update the code in your question and be more specific about what you know already what is not working. Usual tools you can use to debug your application should include: javascript console, rails server log, in doubt using debugger (in both your js and ruby code). If you make sure you get familiar with these tools you will save yourself a lot of time in the future. Anyway would be interesting how your changed code looks now.. – trueunlessfalse Sep 21 '13 at 20:49
  • alright in a couple minutes check the EDIt to my original post – Justin Sep 21 '13 at 21:29

0 Answers0