js.erb working locally but not in production

Question

I followed the tutorial here http://railsforbeginners.com/chapters/chapter-9-infinite-scroll/ for an infinite scrolling. The code works good locally but when I deploy it to prod. the pagination links (1 2 3 4) still show and the infinite scrolling doesn't fire. I also tried to add these files in assets.rb with no success

First of I'm using Rails 4, my application.js looks like this

//= require jquery2
//= require jquery.turbolinks
//= require jquery_ujs
//= require jquery-ui.min
//= require bootstrap-hover-dropdown.min
//= require bootstrap.min
//= require select2
//= require infinite_scroll
//= require turbolinks

Controller action

respond_to do |format|
      format.html
      format.js { render "visitors/index" }
end

index.js.erb

$('#my-articles').append('<%= j render @articles %>');
<% if @articles.next_page %>
$('.pagination').replaceWith('<%= j will_paginate @articles %>');
add_tweets();
<% else %>
$(window).off('scroll');
$('.pagination').remove();
<% end %>



function add_tweets(){
  <% @articles.each do |article|%>
    handle_open_modal("<%= article.id %>");
  <%end%>

}

Unrivaled

How about looking into web developer tools and checking for 404 in network tab there? – Benildis

Can you remove turbolinks from your app and check – Nephoscope

Can you please add production.rb file configuration? – Collogue

Answer 1

Here is what I did to get it working using This Reference

I removed turbolinks and all it's reference

Then added this to the index.html.erb without have to use jQuery $(document).on('ready

if ($('#infinite-scrolling').size() > 0){
        $(window).on('scroll', function(){
          var more_posts_url = $('.pagination .next_page a').attr('href')
          heights = $(document).height() - $(window).height() - 500
            if(more_posts_url && $(window).scrollTop() > heights){
                $('.pagination').html('<img src="/assets/ajax-loader.gif" alt="Loading..." title="Loading..." />')
                $.getScript(more_posts_url)
            }
        });
    }

Then all the *.js.erb start working.

I was trying to avoid removing turbolinks but done trying to get it working with it.

Unrivaled

Answer 2

In your assets.rb

Try this line:

config.assets.precompile += ['Index.js'] 

-> Rails may only reference files by their (non ERB) asset filename

also as a matter of style you should lowercase the filename to: index.js.erb

Upholsterer

As I mentioned above, I did try assets.rb file including your solution without luck. Also the CAP in index is just a typo. Thanks for trying – Unrivaled

Answer 3

Did you make sure that jQuery is loading? As suggested above by going to developers tool Network and reloading. Do your assets precompile in production environment? Make sure you have this config.serve_static_assets = true in your config/application.rb For Heroku and Rails 4 see here

Hajji

Jquery was loaded fine and all the assets were added correctly. As I found previously on SOF and Google – Unrivaled