Asset pipeline - application.js not compiled/loaded

I'm using rails 4 with foundation 5 and I'm having trouble getting javascript to work. Foundation's navbar menu doesn't drop down in mobile and I'm having trouble getting the jQuery datepicker to work. After a bit of searching on this site and on Google, I thought the problem might be that I was using sprockets version 2.1.2. However, after upgrading (now at version 3.3.4) the problem still hasn't been solved.

I removed everthing in application.js and added a function to simple append one div to another to check if the file is being loaded so application.js now looks like this:

//= require jquery
//= require jquery_ujs
//= require jquery-ui/datepicker
//= require foundation
//= require_tree .

$(function(){ $(document).foundation(); });

$(document).ready(function (){
  $('#test').append("<div class='test'>Test</div>");
});

Unfortunately, the div does not get appended. I'm pretty new to javascript and I'm not sure what else I can do to figure out why no javascript is being loaded. Any help with this would be much appreciated.

More Info

When I try to navigate to http://localhost:3000/assets/application.js I get the following:

throw Error("Sprockets::FileNotFound: couldn't find file 'self' with type 'application/javascript'\n (in /home/sheeka/Documents/workspace/my_projects/ruby/technical_tests/homestay/homestay_test/app/assets/javascripts/application.js:17)")

I've no problem bringing up application.css.scss in a similar manner but I'm not entirely sure what this means.

As requested: Github repo

Answers:

Answer

Take a look in the docs at http://guides.rubyonrails.org/asset_pipeline.html

You need to include a require_self in your application.js file.
Without it the functions in this file will not be loaded.

Update

  1. In your app/assets/javascripts/application.js change //= require self to //= require_self

  2. Your $(document).ready functions are not being loaded because the turbolinks gem.
    In your application layout change this line:
    <%= javascript_include_tag "application" 'data-turbolinks-track' => true %>
    To
    <%= javascript_include_tag "application" %>

But if you want to keep it, take a look in this gem: https://github.com/kossnocorp/jquery.turbolinks

There are a few differences that you need to know when you are working with turbolinks, so please take a look in his docs.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.