I have a rails 4.1.x project which has the following application.js file:
//= require jquery
//= require jquery_ujs
//= require jquery.ui.all
//= require turbolinks
//= require showdown
//= require underscore
//= require underscore.string/underscore.string
//= require selectize.js/js/selectize
//= require jquery-bootpag/jquery.bootpag
//= require react
//=require_tree ./helpers
//= require_tree ./react_mixins
//= require_tree ./react_components
//= require backbone
//= require aisis_writer
//= require_tree ./models
//= require_tree ./collections
//= require_tree ./views
//= require_tree ./routers
//= require_tree .
//= require twbs/bootstrap
//= require chosen/chosen.jquery.min
Everything loads fin. Now I can do - from the Underscore js library:
var moe = {name: 'moe'};
moe === _.identity(moe);
And It works, But if I do - from the Underscore.string library:
_.levenshtein('kitten', 'kittah')
And I get undefined function. I was reading: this part of the readme which stipulates how to use it with underscore but I dont know if I have to go that far with rails. I was also looking at this part of the source code and it defines a _s or it integrates with underscore.
Considering underscore.string is loaded after underscore and all the regular underscore functions work - its safe to say it exists. So what's going on? Bot libraries have been loaded properly and their are no console errors aside from the undefined function when I try and use an underscore.string function.
As the readme says, if you want to use the Underscore.string functions from the _ object, you must mix them in. Add the following line before you attempt to use _.levenshtein:
_.mixin(_.string.exports());
Or you can call _.str.levenshtein instead.
Related
I'm working on a project in Rails 5.1.6 / ruby 2.3.1p112 (2016-04-26) [x86_64-linux-gnu]
My problem is that, following step by step the documentation of the gem best_in_place I get an error.
Error:
I am a little complicated with the documentation since it is not fully explained how to implement the gem in Rails 5.
Any help is useful.
Thank you very much!
Important data:
assets / javascripts / application.js
assets / javascripts / use_best_in_place.js
Gemfile
gem list
views / layout / application.html.erb
Why are you loading jquery twice? One in application.js and other in views?
Try removing the one in views and it should work fine.
Just remove this line from your application.html layout (jquery is already require inside application.js from jquery-rails gem):
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
It should work this way.
As per the description shared, need to change the
below mentioned configuration.
//= require rails-ujs
//= require turbolinks
//= require jquery
//= require best_in_place
//= require best_in_place.jquery-ui
//= require twitter/bootstrap
//= require_tree .
To this one
//= require rails-ujs
//= require jquery
//= require turbolinks
//= require best_in_place
//= require best_in_place.jquery-ui
//= require twitter/bootstrap
//= require_tree .
Keep turbolinks after jquery always and try to load best_in_place() function after turbolinks loaded.
# application.js
//= require rails-ujs
//= require jquery
//= require turbolinks
//= require best_in_place
//= require best_in_place.jquery-ui
//= require twitter/bootstrap
//= require_tree .
# assets / javascripts / use_best_in_place.js
$(document).on('turbolinks:load',function(){
jQuery(".best_in_place").best_in_place();
}
I just installed the jQuery UI for my Ruby on Rails application. It runs Rails 5. I have looked at all the similar posts, but they do not apply to my case.
My page renders just fine, but in the Chrome dev tools console, I get this error:
I have rearranged the application.js file all kinds of ways and still get the same error. This is the 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, 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. JavaScript code in this file should be added after the last require_* statement.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery-ui
//= require rails-ujs
//= require html.sortable
//= require turbolinks
//= require_tree .
//= require popper
//= require bootstrap-sprockets
Per the comment above, try the require jquery at the top.
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require turbolinks
//= require_tree .
jquery-ui requires you to have the default JQuery loaded beforehand. That's the reason you are seeing all those errors, as jquery-ui has references to it throughout its code, hence its throwing exceptions. Your application.js should look like this instead:
//= require jquery
//= require jquery-ui
//= require rails-ujs
//= require html.sortable
//= require turbolinks
//= require_tree .
//= require popper
//= require bootstrap-sprockets
I'm facing a problem since yesterday. I try to use Paloma gem (v5) to organize my javascript. But I can't see any tutorial for this, in the current version. That's not the problem, there is a good wiki about it.
But I can't use it, and I don't know why...
Application.js
//= require jquery
//= require jquery_ujs
//= require jquery.ui.datepicker-fr
//= require jquery.ui.monthpicker
//= require jquery.timepicker
//= require jquery.validate
//= require jquery.remotipart
//= require redactor-rails
//= require magnific-popup
//= require selectize
//= require jquery-tablesorter
//= require jquery-tablesorter/jquery.tablesorter
//= require jquery-tablesorter/jquery.tablesorter.widgets
//= require Chart
//= require paloma
//= require_tree .
//= require bootstrap-multiselect
$(document).ready(function(){
Paloma.start();
});
My coffeeScript (it's compatible):
console.log 'hello'
Paloma.controller 'Admin/RGrids', ->
show_users: ->
alert 'it works'
And my controller admin/r_grids_controller.rb
class Admin::RGridsController < AdminController
layout 'admin'
load_and_authorize_resource :r_grid
respond_to(:html, :js)
#show_users prints results in the retention grid for a USER
##return [hash] rgrid_for_user
def show_users
rgrid_scoped = RGrid.only_askers
#show = RGridUtility.r_grid_vars(rgrid_scoped)
end
'Hello' is displayed in the console, so the script is loaded. I tried many things like remove :js in respond_to, or use different way to call the action.
Somebody can help me? :-)
Solved. Need to call Paloma.start() in my application.js with my function in r_grids.js inside the application.js
My Javascript is only loading after refreshing the page in Rails. After looking into it, the recommend solution seems to be to use turbolinks. However, when I include the jquery-turbolinks gem, JQuery itself seems to crash presumably due to some dependency error.
Uncaught TypeError: Cannot read property 'length' of undefined
Here's what my application.js file is looking like
//= require turbolinks
//= require angular/angular.min
//= require angular/angular-route.min
//= require jquery
//= require jquery_ujs
//= require jquery-ui.min
//= require jquery.turbolinks
//= require chosen-jquery
//= require bootstrap
//= require conversations
//= require analytics
//= require common
//= require jquery.infinite-pages
//= require jquery.contenthover
//= require overlay
//= require tag-it.min
//= require_tree .
//= require_tree ../../../vendor/assets/javascripts/.
So to sum it up, if I don't use jquery-turbolinks, my JS won't load until after a page refresh. If I do use it, jQuery crashes. If i try to put it before require jquery, it can't find the JQuery file and said $ is not a function.
Order the jQuery.turbolinks just after jQuery
//= require turbolinks
//= require angular/angular.min
//= require angular/angular-route.min
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require jquery-ui.min
That's the way the jQuery.turbolinks will work correctly
I'm having a problem when pushing to heroku in my rails app.
Lots of functions become undefined, because <%= javascript_include_tags %> are being included before application.js, so libraries are not loaded.
I've tried the "defer" in my script tags, but didn't work.
It's happening ONLY in production, not in my dev environment.
How can I specify Rails to load JS in my view the latest?
Any advice would be great. Thanks
CASE:
My application.js
//= require jquery
//= require jquery_ujs
//= require jquery.lockfixed
//= require jquery.base64
//= require jquery.browser.mobile
//= require masonry.pkgd.min
//= require_directory ./utils
//= require_directory ./helpers
//= require tabs
//= require pining
//= require list
//= require handlebars
//= require jquery.cookiesdirective
//= require albums
//= require landing
//= require bxslider
//= require landing/waypoints
//= require landing/animate-waypoints
//= require handlebars-truncate-helper
//= require spots
My view
<%= javascript_include_tag "call_pining_function" %>
Call_pining_function partial
drawStaticPin();
Error in Heroku
Uncaught ReferenceError: drawStaticPin is not defined
Thanks
Hmm, I still aren't completely sure about this case. I assume that
//= require pining
is the file that contains the drawStaticPin, right?
There are few options that I can see here:
First, Put your "call_pining_function" into the requires of application.js
Second, If the call_pining_function is defined after jQuery (DOM) is ready, possibly you could tie the function call to that event
jQuery(document).ready(function() {
drawStaticPin();
};
Third, Ugly but does the job assuming that the code will eventually be loaded
while (typeof drawStaticPin === "undefined");
drawStaticPin();