I'm a noob to Rails and Javascript. I've made an app with nested attributes while following Ryan Bates' Railscasts 196 & 197 (Nested Model Forms).
Everything works fine upto the point where I use Checkboxes to remove fields. But when I use this in my _question_fields.html.erb:
<%= link_to_function 'remove', 'remove_fields(this)' %>
and this javascript function in /assets/javascripts/application.js:
function remove_fields(link) {
$(link).previous("input[type=hidden]").value = "1";
$(link).up(".fields").hide();
}
nothing happens. I've made sure that <%= javascript_include_tag "application" %> is being included in views/layouts/application.html.erb
Javascript Consoles on Firefox (Firebug) & Chrome (Built-in) throw this error when I click on the remove link.
Uncaught ReferenceError: $ is not defined
Am I missing something very basic? Any help would be appreciated. I'm Using Ruby 1.9.3, Rails 3.2.3 & Mongoid 3.1.2.
Okay, the solution (as pointed out by bfavaretto) was simple enough. We need to use the prototype gem and add it's reference in application.js.
1) In your Gemfile, add:
gem 'prototype-rails'
# You might want to comment out #gem 'jquery-rails'
2) In application.js, above everything else, add:
//= require prototype
//= require prototype_ujs
//= require effects
//= require dragdrop
//= require controls
3) Make sure this line is removed/commented in config/enviroments/development.rb:
#config.action_view.debug_rjs = true
4) Run Bundler and restart Rails Server
$ bundle install
$ rails s # This is important!
Related
I am new to Rails. I followed the documentation and this example: Using Chartkick in Rails 4.0
but I cannot get Chartkick to work. I get undefined method pie chart. My js looks like this:
//= require chartkick
//= require jsapi
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap
//= require_tree .
I have tried including the javascript_include in both the application kayout and the show page. <%= javascript_include_tag "//www.google.com/jsapi", "chartkick" %>
Any ideas? Thanks all. I really do appreciate every bit of help I get here.
It turns out that, since Chartkick runs as an engine, I did not need to add // include chartkick into the application js file- I removed it and it worked like a charm. That means that the steps to get Chartkick to work in Rails 4 are:
add gem 'chartkick' to your Gemfile
add <%= javascript_include_tag "//www.google.com/jsapi", "chartkick" %> to app/views/layouts/application.html.erb
Just add this to your chartkick's javascript_include_tag - 'data-turbolinks-track' => true. Also have a jquery-turbolinks gem installed (with it's correct structure of scripts requiring in application.js file). Finally restart the server.
write
#= require active_admin/base
require chartkick
in active_admin.js.coffee
and call direct jsapi from google like this in partial file.._items.html.ebr in app/views/items folder
javascript_include_tag "//www.google.com/jsapi", "chartkick"
pie_chart order, library: {pieSliceText: 'value'}
and then call this partial file like this
div class: 'custom-class' do
h3 'Items'
#item = Item.group(:menu_id).count #whatever data you pass to chart
render partial: 'items/items', locals: {item: #item}
end
I'm using the ckeditor (https://github.com/galetahub/ckeditor) gem on Rails 3.2.11 / Ruby 1.9.3.
I've been getting this JS error after I do rake assets:precompile on production environment (deployed to Heroku)
Uncaught TypeError: Object #<Object> has no method 'apply'
I don't know if it's relevant, but I've traced the error (using Chrome's webdev tools) to a block that starts:
CKEDITOR.plugins.add("basicstyles", ...)
which I assume is the plugin responsible for adding the bold, italic, underline, and other such font style buttons to the toolbar.
The textarea is still showing without the CKEditor UI.
I'm using the latest version (4.0.4) from rubygems.
I have this in my application.js:
//= require 'ckeditor/init'
//= require 'ckeditor/config'
I have a custom config file in app/assets/ckeditor/config.js and have two custom plugins in app/assets/ckeditor/plugins/.
I've also tested it locally using RAILS_ENV=production and also not working.
I found what's causing the issue. It's an old uglifier version. Moving it from ~> 1.0.3 to >= 1.0.3 (which updated to 2.1.1) solved the issue.
A couple of things that may help
Those //= require lines need to go in your application.js file, your Gemfile should just have gem 'ckeditor'.
also it should be :
app/assets/javascripts/ckeditor/config.js and app/assets/javascripts/ckeditor/plugins
rather than
app/assets/ckeditor/config.js and app/assets/ckeditor/plugins
Finally you can use
<%= f.input :content, :input_html => {:class => 'ckeditor', :rows => "10"}%>
in your views. Note that this is a SimpleForm input.
I used the ckeditor-rails gem and everything went pretty smoothly for me.
Hope it helps.
I'm using Rails 3.2, It's set up for coffeescript. I know Coffeescript is an awesome language and it's not too hard to learn, but i'm JUST starting to wrap my head around Javascript and jQuery. So my question is this: Is there an easy way to set rails 3.2 up to use Javascript instead?
At the moment, my jQuery is in <script></script> tags in my view (timeline/index.html.erb). I'd like to move it into a .js file. I tried changing the name of my timeline.js.coffee to just timeline.js and putting the jQuery in there, but I get Uncaught SyntaxError: Unexpected token ILLEGAL.
What should I do besides the obvious answer of "learn coffeescript"?
I was on the right track. To switch to javascript in rails 3.2 you only need to remove the .coffee extension. However, you also need to make sure you use // for comments instead of #
//# Place all the behaviors and hooks related to the matching controller here.
//# All this logic will automatically be available in application.js.
//# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/
Manifest Files and Directives
http://guides.rubyonrails.org/asset_pipeline.html#manifest-files-and-directives
add js files in app/assets/javascripts, then add the files in application.js
your js file
alert("here");
application.js
//= require_tree .
or
//= require your_js_file_name
then, it will be picked up from the code below in your app/views/layouts/application.html.erb
<%= javascript_include_tag "application" %>
$ rails -v
Rails 3.2.11
how about this?
http://bit.ly/VHEnBX
git clone it
cd js_test
bundle
rails s -d
open http://localhost:3000
# stop the detached server
kill -9 `cat tmp/pids/server.pid`
you should see here alert from the browser.
it's just a simple js file. no .coffee extension or whatsoever.
http://bit.ly/UPe2mp
you can simply comment out gem 'coffee-rails' in your Gemfile
I'm trying to get the best-in-place gem to work on a Rails 3.0 app but nothing seems to work. I can't click on any of the objects to edit them.
This is what I've done so far (following the GitHub instructions from the link above as well as the RailsCast:
In my Gemfile:
gem 'rails', '3.0.11'
gem 'best_in_place', '~> 0.2.0'
I also ran rails g best_in_place:setup since I'm on 3.0 and it generated a best_in_place.js file into public/javascripts.
And finally to display the records to be edited in-place:
<div class="profileGains">"<%= best_in_place #project, :my_quote %>"</div>
I'm using RESTful routes so I have the update action for my project resource.
At this point, the record is displayed but I can't click on it (or any of the other ones).
Any suggestions? I'm new to JS and really stuck.
EDIT: I created an application.js file in which I added the following code:
//= require jquery
//= require jquery.purr
//= require best_in_place
$(document).ready(function() {
/* Activating Best In Place */
jQuery(".best_in_place").best_in_place();
});
I also tried the suggestion in the comments by Richlewis to add a script tag in my view:
<script type="text/javascript" src="/public/javascripts/best_in_place.js"></script>
Finally, I tried changing <%= javascript_include_tag :defaults %> to
<%= javascript_include_tag :all %> in my application.html.erb layout file.
And again, best-in-place doesn't work.
UPDATE: When inspecting the element using Chrome I found this error displayed in the logs:
Uncaught TypeError: Object [object Object] has no method 'best_in_place'
application.js line 7
Any idea what this means?
Answering my own question as I figured it out. The best_in_place.js file wasn't being rendered in my view because this code //= require best_in_place only works for apps with an asset pipeline.
I had to explicitly declare the best_in_place.js file in my application layout file. That did the trick.
I'm following the demo_app in Michael Hartl's book Ruby on Rails 3 Tutorail. The demo is a simple Scaffold User name:string email:string
I'm getting an error in my application.html.erb file:
Errno::EINVAL in Users#index
Showing ~/demo_app/app/views/layouts/application.html.erb where line #6 raised:
Invalid argument - cscript //E:jscript //Nologo //U /tmp/execjs20120323-4388-1an85xw-0.js 2>&1
(in ~/demo_app/app/assets/javascripts/users.js.coffee)
3: <head>
4: <title>DemoApp</title>
5: <%= stylesheet_link_tag "application", :media => "all" %>
6: <%= javascript_include_tag "application" %>
7: <%= csrf_meta_tags %>
8: </head>
9: <body>
if I chnage line #6 to:
<%= javascript_include_tag "default" %>
The program will run perfectly except it won't allow me to delete users (presumably because it's not running the javascript).
Environmental info:
$ ruby -v
ruby 1.8.7 (2012-02-08 patchlevel 358) [i386-cygwin]
$ rails -v
Rails 3.2.2
Content of ~\demo_app\app\assets\javascripts\users.js.coffee:
# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/
Content of ~\demo_app\app\assets\javascripts\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
// 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 jquery_ujs
//= require_tree .
try to uncomment gem 'therubyracer' and run bundle, and also it's better to use last stable version of ruby
I searched around for other questions that discussed the gem therubyracer. I found one answer that suggested what Said Kaldybaev had suggested here. That didn't work for me. But there was another suggestiong to remove the code
//= require_tree .
from the app/assets/javascripts/application.js file.
Deleting that code made the application work (including the destroy function).