I can't get my prints.js file to get picked up by the manifest (I presume that is the issue.)
this is in the appliction.js manifest:
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require turbolinks
//= require 'main'
//= require 'cards'
//= require 'prints'
//= require_tree .
the cards.js has a console log saying hello like this :
$(document).on('turbolinks:load', function() {
console.log('cards js file executed.')
...
});
When I do the same thing for cards.js like this:
$(document).on('turbolinks:load', function() {
console.log('Prints js file executed.');
});
the console only calls out the cards.js console log statement, but not prints.
I restarted rails server, and rebooted my local machine hoping that would pick it up. but no result.
(Rails 4.2)
EDIT
I am decided to use the application.js for hosting the function I need.
Though it works, it feels 'cheap' and if anybody has any suggestions of what could make a manifest not include files, that would be greatly appreciated. But I have a temporary solution.
try without quote like following. after change please restart server
//= require main
//= require cards
//= require prints
Related
Basically I have a show page for b_page and I have rendered a new partial inside (for page_posts) and the submit button for it only works if it the page is refreshed or if the link is directly opened from the browser. I've checked and there are no missing divs or unopened tags etc, hence it's not an HTML issue.
Maybe it's a Turbolinks issue cause this happens in almost all of the app and if so here's my application.js.erb:
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery.ui.all
//= require jquery.turbolinks
//= require jquery_ujs
//= require bootstrap
//= require bootstrap-tagsinput
//= require sync
//= require masonry/jquery.masonry
//= require jscolor
//= require_tree .
//= require owl.carousel
//= require turbolinks
How can I fix this? Here's the link to show.html.erb.
You must be using $(document).on('ready', function(){})
Change it to $(document).on('turbolinks:load', function (){}), this forces JavaScript to load at the time page is viewed.
Just deployed a Rails 5.x application and installed a theme. The theme's contents are located within the app/assets/javascripts/theme-js and app/assets/stylesheets/theme-files folders.
Inside of the app/assets/javascripts/application.js file includes the following:
//= require jquery
//= require jquery_ujs
//= require_tree .
// Required for the SmartAdmin theme
//= require theme-js/app.config.js.erb
//= require theme-js/app.js
And inside of the app/assets/javascripts/theme-js folder are have the following files (included with the theme):
app.config.js.erb
app.js
application.js
The problem that I'm having is that inside of the application.js file contains a line that states: //= require app.config, but Rails generates me an error stating the following:
couldn't find file 'app.config' with type 'application/javascript'
Even though app.config.js.erb is in the same folder as application.js. Is there any reason why this would happen? Can't figure out why this won't work. I've even tried //= require app.config.js and //= require app.config.js.erb and neither one of them work.
I noticed that //= require ./app.config appears to work whereas //= require app,config doesn't. Something new with Rails 5.x perhaps? I'd have to modify all of the require statements to fit this unless I'm missing something.
Problem solved. Just needed to add the custom theme-js and theme-css folder to the assets pipeline so that Rails can search those folders for the appropriate files when using //= require <file>. Assuming this is what I needed to do, although I'm not sure if it's best practice.
I am having a issue with javascript not running properly on my production environment. I precompiled my assets with
rake assets:precompile RAILS_ENV=production
before pushing code up to git and heroku but it refuses to execute bootstrap's js functions, google analytics/new relic code, menus, image sliders, etc. Here's my application.js
//= require jquery
//= require bootstrap
//= require jquery_ujs
//= require menu
//= require jquery-ui/autocomplete
//= require autocomplete-rails
//= require jquery-ui/accordion
//= require jquery-ui/tooltip
//= require jquery.raty
//= require search
//= require sameheights
//= require nprogress
//= require sweet-alert
//= require sweet-alert-confirm
//= require select2
//= require ratyrate
//= require local_time
//= require tinymce-jquery
//= require fancybox
//= require_tree .
When I inspect the page, there are no errors or warnings. Some of these functions work correctly on development, but not all. I tried removing each of the lines one by one to see if I could find a culprit but no luck. In fact, since the last time I precompiled assets, the only files that were added were menu, search, and sameheights so everything was working fine beforehand.
Additionally, my production environment correctly sees the minified application.js and application.css files with all the pertinent functions and I have already checked for dupes as well. HELP!
It seems that the issue might be with either jquery or bootstrap. I removed both gems and added cdn hosted versions and it seems to have resolved the issues.
I'm trying to get a jquery plugin (geocomplete) to work and am having an issue with my rails asset pipeline.
To get the plugin to work, I need to load a .js file called jquery.geocomplete.js located in my /vendor/assets/javascripts/ directory
In my application.js file I include jquery.geocomplete
//= require jquery
//= require jquery_ujs
//= require bootstrap.min
//= require turbolinks
//= require jquery.turbolinks
//= require jquery.geocomplete
//= require jquery.geocomplete.min
//= require underscore
//= require gmaps/google
//= require_tree .
When I load my app in development mode, I can see in the source code that the following asset has been loaded:
<script data-turbolinks-track="true" src="/assets/jquery.geocomplete.js?body=1"></script>
However, the plugin requiring does not work. To get it to work I have to paste:
<script src="/assets/jquery.geocomplete.js"></script>
into my relevant view. (This then causes issues when I run in production mode in Heroku)
Can anyone tell me why the myjquery.geocomplete.js file will not run my plugin when I load it through the asset pipeline?
Any thoughts/ideas appreciated.
In the bootstrap sass download ( https://github.com/twbs/bootstrap-sass/archive/v3.1.1.tar.gz ) there is a strange bootstrap.js file with all of these lines here commented out, like so:
//= require bootstrap/affix
//= require bootstrap/alert
//= require bootstrap/button
//= require bootstrap/carousel
//= require bootstrap/collapse
//= require bootstrap/dropdown
//= require bootstrap/tab
//= require bootstrap/transition
//= require bootstrap/scrollspy
//= require bootstrap/modal
//= require bootstrap/tooltip
//= require bootstrap/popover
These correspond to the folder below that has the js files named by each "require" line.
Are these some sort of special server side include system for javascript?
While we are on the subject, what is the best practice for including these files in a page? 1 by 1 as they are needed (more requests?) or simply pasting them into a master file as needed (more work indeed, and subject to change, more stuff to track).
Perhaps there is something I am missing here.
These JS files are intended to be loaded/compiled by Sprockets.
If you are not using Rails, look at a solution for sinatra: https://gist.github.com/datenimperator/3668587