Bootstrap-sass gem Javascript not Working in Rails 4 - javascript

when using the bootstrap-sass gem i have loaded my css files properly, however have been receiving an error when i try loading the javascript files. I have followed the procedure of loading javascript from https://github.com/twbs/bootstrap-sass however when I view my webpage on localhost I receive the error "couldn't find file 'bootstrap'"
This is what my application.js file looks like - Any help would be much appreciated!
Application.js
// 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 vendor/assets/javascripts of plugins, if any, 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/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require turbolinks
// Loads all Bootstrap javascripts
//= require bootstrap
//= require_tree .

From the Rails 4 the :assets group isn't used anymore, please remove the group from Gemfile:
Rails 4.0 removed the assets group from Gemfile. You'd need to remove that line from your Gemfile when upgrading. You should also update your application file (in config/application.rb):
Bundler.require(:default, Rails.env)

I got it to work by removing gem 'bootstrap-sass', '~> 3.0.3.0' out of the assets group in gemfile! YAY

Did you bundle install and make sure you are loading application.js (from the assets pipeline).

Related

Rails UJS: javascript file of ruby gem not available in Chrome network tab?

Rails comes with the jquery-ujs gem. In the src of this gem, there is a file called rails.js, which contains the functionality of the ajax. I have the gem loaded in my app and it works. I have the following in application.js:
//= require jquery
//= require jquery_nested_form
//= require jquery_ujs
However, in the Network tab in chrome, I see all the javascript files of my app. But when I search for rails.js, it does not appear. How could this be possible? Is the files of the gem precompiled by default? Is in a file with another name?
I think the rails.js is compiled and merged on application.js. Try open application.js on network and with ctrl + f find this jquery-ujs has already been loaded!
[edit]
I create a new rails project with version 5, and I can see the rails ujs on network tab:
see the image here
Change this on your enverioment file:
config.assets.debug = true
[edit 2]
Image with rails 4

vendor javascript files missing from rails project

I am using rails v4.2.4. I have tried creating a test app using the command
rails new app
Even though I can see the jquery references in the Gemfile (also present in application.js), and I have ran bundle install as well, however, the vendor/assets/javascript directoy is empty and does not include the JS files. I have already ran bundle install as well. Am I supposed to add them by hand or did I miss a command to pull those files for me in the Rails project?
application.js file in app/assets/javascripts
// 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_ujs
//= require turbolinks
//= require_tree .
jQuery.js is inside vendor/assets/javascripts directory of respective gem. jquery-rails is a so called Rails Engine, which is a "mini-app" by itself.
Engines can be considered miniature applications that provide functionality to their host applications. A Rails application is actually just a "supercharged" engine, with the Rails::Application class inheriting a lot of its behavior from Rails::Engine.
How to find jquery-rails home dir
Issue command (to find out where jquery-rails is located):
gem which jquery-rails
#=> /home/dimitri/.rvm/gems/ruby-2.1.5/gems/jquery-rails-4.0.5/lib/jquery-rails.rb
jquery-rails's home dir, based on output, is:
/home/dimitri/.rvm/gems/ruby-2.1.5/gems/jquery-rails-4.0.5
Your versions and path may be different.

RoR 4.2.0 Jquery not defined

in my ror application i've a jquery error during the execution. On the Google Chrome Application appear this message
Uncaught ReferenceError: jQuery is not defined
this is my application.js:
// 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 vendor/assets/javascripts of plugins, if any, 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/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require foundation
//= require turbolinks
//= require_tree .
$(function(){
$(document).foundation('alert');
});
In the gemfile is present the jquery-rails gem.
I really don't know where crush my head. All the help is appreciated
remove Gemfile.lock
do
$bundle install
now check if jQuery works

jQuery/Javascript runs on local but not on Heroku

This is my app on Heroku: http://mighty-brushlands-6367.herokuapp.com/ and this is how it SHOULD look, as it does locally:
Well I did some googling. I check this solution: JQuery events are not working on heroku in production but work in development and others.
I went ahead to run heroku run rake assets:precompile but still can't get the effects to kick in on Heroku. This is how my application.js looks like:
// 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 vendor/assets/javascripts of plugins, if any, 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/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
//= require bootstrap
//= require textEffect
I need some guidance. I'm a hungry-for-knowledge newbie.
Your Heroku app is getting a 404 error on the application.js & application.css files which leads me to believe it is not getting pushed to Heroku in the first place.
Try running rake assets:precompile in development, then the usual steps git add . , then git commit, and then git push.
The solution was to add
group :production, :staging do
gem 'rails_12factor'
end
To the Gemfile and commit again to Heroku

undefined method `pageless' using jquery.pageless in Ruby on Rails

I'm trying to implement an infinite scroll and using jquery.pageless
But I'm getting this error: undefined method 'pageless'
I include jquery.pageless.js on my application.html.erb in assets:
<%= javascript_include_tag 'jquery-1.3.2.min', 'jquery.pageless' -%>
Any suggestion about how to solve this?
I don't know why you are using the format:
<%= javascript_include_tag 'jquery-1.3.2.min', 'jquery.pageless' -%>
in application.rb.
In assets/javascript/application.js, add those files:
// 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 vendor/assets/javascripts of plugins, if any, 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.
//
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
//
//= require jquery
//= require jqeury.pageless
//= require jquery_ujs
//= require_tree .
You need to make sure you have jquery installed:
gem install jquery-rails
then:
bundle install
Also make sure you have the jquery-pageless.js files in on of the paths mentioned in the application.js file so it gets picked up by the asset pipeline.
Application.js file:
// 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 vendor/assets/javascripts of plugins, if any, 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/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery.pageless
//= require jquery_ujs
//= require turbolinks
//= require_tree .

Categories

Resources