javascript not rendering on cloud server in rails4 app - javascript

This is my custom layout file:
<%= stylesheet_link_tag 'template/template', media: 'all', "data-turbolinks-track" => true %>
<%= javascript_include_tag 'template/template', "data-turbolinks-track" => true %>
<%= csrf_meta_tags %>
and the below is my template.js file:
//= require jquery.min
//= require jquery_ujs
//= require jquery.turbolinks
//= require bootstrap.min
//= require gmap3.min
//= require jquery.appear
//= require jquery.bxslider.min
//= require turbolinks
I have made required changes in production.rb file, assets.rb and application file but the javascripts are not rendering on the production server.
I am getting the path of the my javascript file locally but on production server its showing Not Found.
What did I miss?

Related

$ is not defined error in production environment Rails 5.1.7

jQuery and ujs work fine in the development environment, but are not working in production environment.
This is what my code looks like:
application.html.erb
<html>
<head>
<%= csrf_meta_tags %>
<meta name="viewport" content="width=device-width, initial-scale=1">
<%= stylesheet_link_tag 'application', media: 'all' %>
<%= javascript_include_tag 'application' %>
</head>
<body>
<%= yield %>
</body>
</html>
application.js
//= require jquery
//= require jquery_ujs
//= require jquery-ui/widgets/sortable
//= require js-routes
//= require semantic-ui
//= require swiper
//= require cocoon
//= require tree_table
//= require jquery_throttle_debounce
//= require trix
//= require_tree .
window.jQuery = $;
window.$ = $;
Any page that uses the application layout has ujs not working and is getting $ is not defined error for jquery codes in production environment only.
Note: I recently removed turbolinks from the application.

The best_in_place is not working on Heroku, and no error appears

I would appreciate any help. This is the repository of this project: https://github.com/felixpro/ars-reclama
The best_in_place is working fine in development production but when I deploy it to Heroku it doesn't work. When I click on the best_in_place input, nothing happens.
thank you
aplication.js
//= require jquery
//= require jquery_ujs
//= require jquery.purr
//= require best_in_place.purr
//= require best_in_place
//= require best_in_place.jquery-ui
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
$(document).ready(function() {
jQuery(".best_in_place").best_in_place();
});
gemfile
gem "jquery-ui-rails"
gem "best_in_place"
gem 'jquery-rails'
gem 'draftsman', '~> 0.7.1'
show.html.erb
<h1 class="name">
<%= best_in_place #customer, :name%>
</h1>
<div class=" space email display_box">
<%=image_tag("envelope.png")%>
<p><%= best_in_place #customer, :email %></p>
</div>
<div class=" space doc display_box">
<%=image_tag("doc.png")%>
<p><%= best_in_place #customer, :doc %></p>
</div>

Rails asset pipeline - add only jquery to head

I have couple of js files and I put them into vendor/assets/js. Then I require them in the application js file as;
//= require jquery
//= require jquery_ujs
//= require dropzone
//= require jquery.cookie
//= require toastr
//VENDOR JS BEGINS
//= require pace/pace.min
//JQuery buraya gelecek sonra
//= require modernizr.custom
//= require jquery-ui/jquery-ui.min
//= require boostrapv3/js/bootstrap.min
//= require jquery/jquery-easy
//= require jquery-unveil/jquery.unveil.min
//= require jquery-bez/jquery.bez.min
//= require jquery-ios-list/jquery.ioslist.min
//= require jquery-actual/jquery.actual.min
//= require jquery-scrollbar/jquery.scrollbar.min
//= require bootstrap-select2/select2.min
//= require switchery/js/switchery.min
//= require imagesloaded/imagesloaded.pkgd.min
//= require jquery-isotope/isotope.pkgd.min
//= require classie/classie
//= require codrops-stepsform/js/stepsForm
//= require bootstrap-datepicker/js/bootstrap-datepicker
//= require bootstrap-datepicker/js/locales/bootstrap-datepicker.tr.js
//= require bootstrap-datepicker/js/locales/bootstrap-datepicker.en.js
//= require summernote/js/summernote.min
//= require moment/moment-with-locales.min
//= require bootstrap-daterangepicker/daterangepicker
//= require bootstrap-timepicker/bootstrap-timepicker.min
//= require codrops-dialogFx/dialogFx
//= require ion-slider/ion.rangeSlider.min
//= require owl-carousel/owl.carousel.min
//VENDOR JS ENDS
at the top of the page I require jquery and jquery_ujs belongs to jquery. Right now, I load the application js files as;
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
The thing is, I have couple of js codes inside ..html.erb files, which needs the page loads first. But I would like to merge them in a js file. What I would like to do is call only jquery in the head tag and call application js files in body. But if I remove jquery gem and call it as;
<%= javascript_include_tag 'jquery.min', 'data-turbolinks-track' => true %>
Rails gives an error about jquery_ujs. Ofcourse I can add jquery_ujs there as well. But what is the best practise?
The most rails-esque way to add page specific js code to your rails app (thus avoiding loading js in every page when a library or script is only needed in one page) is to add to the very bottom of your layouts/application.html.erb file right before the closing body tag:
<%= yield :javascript %>
</body>
</html>
Then on the view that you're looking to run some snippets of javascript you should put this at the very bottom of it after all html tags have been closed. Make sure it's not within some divs or anything in that view but at the very bottom of it.
Updated referencing Fred:
<%= content_for :javascript do %>
<script type="text/javascript">
$(document).on('page:load', function() {
all your code here..
});
</script>
<% end %>
This code will now be yielded to the bottom of your layout view only loading on the specific views you need instead of being concatenated along with all other assets in your assets/js folder. I do this with all custom js that isn't application wide and it's very easy to maintain/debug.

DEVISE - No route matches [GET] "/users/sign_out" - Rails 4

Nothing on the internet solved this problem.
I'm running on Rails 4.2.3 and Ruby 2.1.5
After an installation of devise, I got this error.
When I delete the line
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true % from my layout file, the error is gone and everyting looks fine.
I tried everything found on stackoverflow, didn't work.
Right now:
I use <%= link_to "sign out", destroy_user_session_path, method: :delete %> in my layout.
I tried to change the initializer : config.sign_out_via = :delete to "get" also, didn't work. Now remains "delete". Anyway it should be delete in my opinion.
My application.js file includes : //= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
Routes.rb file includes devise_for :users, path_names: {sign_in: "login", sign_out: "logout"}. If I don't add this line, it's not working also.
If I delete <%= javascript_include_tag 'application', 'data-turbolinks-track' => true % from my layout file it's working. If I don't, it's not working.
What is the problem with this javascript thing? Any opinion is welcome.
Try using the jquery-turbolinks gem and modify your application.js to look like this:
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require_tree .
//= require turbolinks
Ok the problem seems like because of Windows. The solution is adding the gemfile : 'coffee-script-source', '1.8.0' and bundle update coffee-script-source This solved.

Load custom JS files in specific view

I have a view that has a diagram tool implemented in JS using kineticjs and I want to load the JS files just in a specific view.
I have done this:
In the view:
<% content_for :head do %>
<%= javascript_include_tag "diagrams" %>
<% end %>
The manifest js file named diagrams.js:
//= require diagramtool/kinetic
//= require diagramtool/diagramtool0
//= require diagramtool/diagramtool1
//= require diagramtool/diagramtool2
The application.js file (removed the require_tree):
//= require jquery
//= require bootstrap-sprockets
//= require jquery
//= require jquery_ujs
//= require turbolinks
The layout, application.html.erb:
<!DOCTYPE html>
<html>
<head>
<title>Realyzor</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= yield(:head) %>
<%= csrf_meta_tags %>
</head>
And added this line in config/initializers/assets.rb:
Rails.application.config.assets.precompile += %w( diagrams.js )
And my problem is that, in order to get the files loaded I have to go to the view and refresh the page.
Why do I have to go to the view and then refresh the page to get the JS files loaded?
Why the JS files are not load when I go to the view?
I'm using rails 4.1.5

Categories

Resources