Endless scrolling stops working after generating theme

Question

I've been following #114 Endless Scrolling Railscast (http://railscasts.com/episodes/114-endless-page-revised) and I've gotten the endless scrolling feature to work with Kaminari.

However, when I generated the theme for Foundation the endless scrolling feature stops working and pagination is instead shown.

products.js.coffee

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

index.html.erb

   <div id="products">
    <%= render "products" %>
   </div>

   <div class="row">
    <div class="small-12 columns">
      <%= paginate @products, window: 2 %>
    </div>
   </div>

index.js.erb

$('#products').append('<%= j render "products" %>');
<% if @ products %>
  $('.pagination').replaceWith('<%= j paginate(@products) %>');
<% else %>
  $('.pagination').remove();
<% end %>
<% sleep 1 %>

To generate Foundation Views https://github.com/amatsuda/kaminari_themes/tree/master/foundation

rails g kaminari:views foundation

Why would the generated views stop the endless scrolling from working? Thanks.

Edit

I am using Foundation 5 and the Kaminari gem, not will_paginate.

Gemfile

source 'https://rubygems.org'
ruby '2.1.3'


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.1.6'
# Use postgresql as the database for Active Record
gem 'pg'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 4.0.3'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# Use CoffeeScript for .js.coffee assets and views
gem 'coffee-rails', '~> 4.0.0'
# See https://github.com/sstephenson/execjs#readme for more supported runtimes
# gem 'therubyracer',  platforms: :ruby

# Use jquery as the JavaScript library
gem 'jquery-rails'
# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks
gem 'turbolinks'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.0'
# bundle exec rake doc:rails generates the API under doc/api.
gem 'sdoc', '~> 0.4.0',          group: :doc

# Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
gem 'spring',        group: :development

# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'

# Use unicorn as the app server
# gem 'unicorn'

# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development

# Use debugger
# gem 'debugger', group: [:development, :test]

gem 'friendly_id', '~> 5.0.0'
gem 'pg_search'
gem 'actionpack-page_caching'
gem 'rails-observers'

gem 'foundation-rails'
gem 'rails_12factor', group: :production
gem 'jquery-turbolinks'
gem "font-awesome-rails"
gem 'kaminari'

Answer 1

I managed to figure out what was wrong.

By generating the Foundation views, I needed to change products.js.coffee to:

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

Note the change in url.