web-dev-qa-db-fra.com

Uncaught ReferenceError: $ n'est pas défini rails

J'essaie d'ajouter l'éditeur Froala à mon projet.

Problème uniquement sur le serveur de production (sur localhost cela fonctionne très bien) J'utilise Rails 4.1.0 En gemfile, je suis

gem 'jquery-Rails'

Dans mes assets/javascripts/application.js:

//= require jquery
//= require jquery_ujs
//= require foundation
//= require turbolinks
//= require_tree .
//= require modernizr
//= require froala_editor.min.js

Dans le fichier new.html.erb:

<div class="row">
  <%= form_for :article do |f| %>
    <p>
        Title<br>
        <%= f.text_field :title %>
    </p>
    <p>
        Content<br>
    <%= f.text_area :text, :id=>'content' %>
    <p>
    <%= f.submit %>
    </p>
  <% end %>
</div>
<script>
  $(function() {
    $('div#content').editable({
      inlineMode: false
    })
  });
</script>

Dans application.html.erb:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
    <title><%= content_for?(:title) ? yield(:title) : "foundation-Rails" %></title>
    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
    <%= javascript_include_tag "vendor/modernizr" %>
    <%= javascript_include_tag "application" 'data-turbolinks-track' => true %>
    <%= csrf_meta_tags %>
  </head>
  <body>
    <%= yield %>
  </body>
</html>

Dans ce cas, le résultat est:

Uncaught ReferenceError: $ is not defined

Si j'ajoute une chaîne:

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>

le résultat est:

Uncaught TypeError: undefined is not a function
10
bartezr

Remplacer application.html.erb

<%= javascript_include_tag "application" 'data-turbolinks-track' => true %>

à

<%= javascript_include_tag "application" %>
6
Vedprakash Singh

essayez de changer ces lignes:

<%= javascript_include_tag "vendor/modernizr" %>
<%= javascript_include_tag "application" 'data-turbolinks-track' => true %>

va devenir

<%= javascript_include_tag "application" 'data-turbolinks-track' => true %>
<%= javascript_include_tag "vendor/modernizr" %>
2
cristi_razvi

Comment avez-vous ajouté la fondation au projet?

Dans app/assets/javascripts/aplication.js

J'ai eu la même erreur 

$ n'est pas défini

et j'ai résolu en rechargeant la fondation js de cette façon:

jQuery(document).ready(function($) {
$(document).foundation();
});
1
Riru Isla

Une solution qui fonctionne pour moi est la suivante:

Fichiers séparés

créer des contenus/javascripts/jquery_init.js: 

//= require jquery
//= require jquery.turbolinks
//= require jquery.cookie
//= require jquery.ui.all
//= require jquery_ujs

un appel avant aplication.js 

<%= javascript_include_tag "jquery_init" %>
<%= javascript_include_tag "application", :async => !Rails.env.development?, "turbolinks-data-track" => true %>
1
scampetel

C'était ma solution:

Mettez ceci dans votre application/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs

et installez ce fichier bijou:

gem 'jquery-Rails'
0
jasmineq