ActiveAdmin with Rails 3.1 breaking javascript - javascript

I just implemented the ActiveAdmin gem with my Rails 3.1 app, and it caused a problem with some javascript I have in my app which allows ajax posting of comments. Removing the active_admin.js file causes the problem to go away. How do I keep the active_admin's javascript while preserving the functionality of my app? Any ideas on what the problems may be?
Contents of active_admin.js:
//= require active_admin/base
Contents of my application.js file:
//= require jquery
//= require jquery_ujs
//= require_tree .
Javascript that is being broken by ActiveAdmin:
jQuery ->
$('.addcomment').live("click", ->
$(this).closest('.comment_area').find('.add_comment_box').parent().removeClass("add_comments_box_hidden").addClass('add_comments_box')
return false )
init_csrf = ->
window._settings.token = $('meta[name="csrf-token"]').attr 'content'
$.ajaxSetup
beforeSend: (xhr) ->
xhr.setRequestHeader "X-CSRF-Token", _settings.token
jQuery ->
$('.post_comment_btn').live("click", ->
$(this).closest('.comment_area').addClass('add_comment_here')
$.post(
'/comments'
$(this).closest('form').serialize()
null
"script"
)
return false )
Link to active_admin github page.

I don't know if this will help you ... I'm also using active_admin's javascript separately from the active_admin app. I faced a problem with double requests on clicking to "ajax links". The problem was caused by triggers in the vendor.js file. This has been fixed with the latest version of the gem (vendor.js has been removed) and proper inclusion statements in my application.js file.
I would suggest you to replace //=require_tree . with explicit require statements. Try one by one to add your deps till you find the problem.
Moreover, please provide us with the version of ActiveAdmin that you are using.

The problem is ActiveAdmin includes its own version of jQuery, which overrides your version. If you've added any plugins to jQuery, they will disappear.
Luckily there's an easy fix - don't explicitly include any javascript for ActiveAdmin. You don't need to. Active Admin knows to pull the javascript it needs from the ActiveAdmin gem. So just delete that require line and you should be fine.

When you delete require line in active_admin.js, than delete or update link(default_actions) in index doesn't work, so let that line be and:
Replace //= require_tree . with exact js files in your assets one by one. This finally solved my problem !
Hope it'll save some time to someone.
Regards

Related

Properly requiring three.js in Rails

I tried searching for a solution for this, but unfortunately nothing useful I could find came back.
I'm currently building a new Ruby on Rails application and attempting to include three.js to start practicing using it. In order to test if it was successfully required I'm using my browser console, but receiving the error:
ReferenceError: THREE is not defined
From what I saw on this question: Most efficient way to get a Three.js project to work in a ruby on rails app?
I should be receiving a return value.
I've tried both adding the three.js file in the assets/javascripts folder and using the threejs-rails gem here: https://github.com/marvindanig/threejs-rails with no success.
I've made sure to require it in the asset pipeline in the application.js file:
//
//= require three
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
Does anyone have recommendations on what I should try next? My main issue right now appears that it's not being required correctly.
EDITED: Problem was solved. Turns out I was inheriting from the wrong controller model.
Take the Three.js file and drop it in your assets/javascript folder.
In your application.js make sure you have at the end "//= require_tree ." and it should be working fine. You should remove the "//= require three" line because rails loads it automatically and you shouldn't load anything before jquery and turbolinks or else things won't load correctly. If you want to add it to your project explicitly, add it at the end just before "//=require_tree ."
a.) Include your three.js file in
"app/assets/javascripts/three.js"
b.) in application.js file write #= require three
Make Sure server should be running. refresh the web page and type in web console(F12): Three, If it gives return result. it's done.

Rails: $ is not defined

Noted Things
Rails 4.1.8
jquery rails 3.1.3
Windows 7
I am currently trying to run a simple coffescript under app/assets/javascripts/login.jscoffe
# login.js.coffee #
$(document).on "page:change", ->
$('#loginb').click ->
alert "Clicked!"
When I load up the page I get a console error.
Uncaught reference error $ is not defined
Now I have tried several things, such as using rake precompile. Made sure I included in application js below.
//= require jquery
//= require jquery_ujs
I've been reading up to see if there are other solutions. Some saying things about turbolinks. Should I just include the jquery right into the html page?
So I back upped a little I how I set up my first app. Using a windows 7 machine you run into a problem defined in this article ---> ExecJS::RuntimeError on Windows trying to follow rubytutorial
Since I took the easy way out(going into application.html.erb and changing the linking tag from "application" to "default" fixed a problem but also created more. I then had to load each script I wanted using the include tag and precompile assets files.
The solution came in when I took a step back and used the answer to the link above. Fixing the ExecJs and reintegrating the default functionally of the app seem to fix things.

Is Fullcalendar 2 incompatible with Bootstrap 3 and Rails 4 (I really need help...days on this)

My fullcalendar calendar is not rendering at all. Ever.
Earlier today I posted my Jsfiddle testing all my files for compatibility before putting them in my rails 4 app. That question was answered and my jsfiddle showed my bootstrap 3 and fullcalendar 2 working together fine.
This is that posting: Fullcalendar 2 not rendering, Bootstrap 3 & Rails 4 Incompatibility? (Jsfiddle included)
Then I put them in my rails 4 app.
I put them in asset pipeline, in correct order and NOTHING showed up.
Then I turned off asset pipeline and old-school linked them in the head of my application.html. Nothing showed up (except my navbar and footer).
I removed my navbar and footer and tried again. NOTHING.
I really don't understand what I'm doing wrong. I haven't modified the code. I'm just using these few files posted on the jsfiddle (that I'll put a link to in the comments).
Can someone point me in a direction to test/ look.
Thank you!
Steps to integrate full calendar in a rails app
First Download moment.min.js and fullcalendar.min.js file and place them inside vendor/assets/javascripts directory.
Download fullcalendar.css and fullcalendar.print.css file and place them inside vendor/assets/stylesheets directory.
Now in your application.js file add the javascript files right after jquery like
#application.js
//= require jquery
//= require jquery_ujs
//= require moment.min
//= require fullcalendar.min
//= require turbolinks
//= require_tree .
In your application.css file add reference to the css files like
*= require_tree .
*= require fullcalendar
*= require fullcalendar.print
*= require_self
In your view add a div with an id calender
<div id='calendar'></div>
Now create a js file calendar.js inside app/assets/javascript with the following code
$(document).on('ready page:load', function () {
$('#calendar').fullCalendar({
// put your options and callbacks here
})
});
I rebuilt this app three times and verified the css and less before finally figuring out what I had done wrong.
I am very new to rails, and though that I HAD to include require_tree in the manifest. Once I removed it and just manually added the necessary files, my app worked beautifully. And I felt like a dunce. I hope this helps someone else.

jQuery Ui and Rails

I have the jquery (gem 'jquery-rails') gem installed. My application.js file is correct. The UI (date picker) does not show up. I updated the HTML code, (id="datepicker") in my input field, but nothing when I click on it. So i downloaded the jQueryUI from the website with a custom theme, but still nothing. Any help installing the jQuery-UI for rails using a custom theme downloaded??
application.js:
//= require jquery
//= require jquery-ui-1.8.23.custom.min
//= require jquery_ujs
//= require twitter/bootstrap
//= require_tree .
the jQuery custom theme came with a css folder and a jquery 1.80 file (which I dont need because I already have) and the jquery-ui-1.8.23.custom.min file which I put into the vendor/javascript folder.
I dont want to use this https://github.com/joliss/jquery-ui-rails because it does not support custom themes. Just tell me where to copy paste files so I can get it done quickly
Thanks
It is not enough to just download the plugin, put it into the assets and change the id of your input. You have to code some javascript like this:
$("#datepicker").datepicker();
I was unable to get jQuery ui working until I precompiled the assets...
RAILS_ENV=production bundle exec rake assets:precompile
This fixed it for me. (I think deleting the contents of public/assets would also have worked.)

What can cause Rails 3.1 "= require jquery" to stop working?

I'm porting a Rails 3.0.9 app to Rails 3.1.rc5. My application.js is exactly the same as one generated by Rails 3.1 itself:
// This is a manifest file ...
//
//= require jquery
//= require jquery_ujs
//= require_tree .
But when I run my app and look at the application.js in Firebug or Chrome Developer Tools, all I see is:
// This is a manifest file ...
//
The directives are gone, so it would seem that the file has been processed by Sprockets, but the directives have not been replaced by the contents of jquery et al. There are no errors appearing on the server console or in the logs.
Curiously, when I run a blog app (you know, the canonical tutorial app) it works fine (that is, when I examine application.js in Firebug, it contains the text of jQuery.) This would seem to indicate that something in my app is somehow interfering with Sprockets. Has anyone out there heard of such an issue (and hopefully a workaround)?
Here's my setup:
$ gem list jquery
*** LOCAL GEMS ***
jquery-rails (1.0.12)
$ ruby -v
ruby 1.9.2p290 (2011-07-09) [i386-mingw32]
$ rails -v
Rails 3.1.0.rc5
I'm at a loss as to what might be wrong. I've triple checked my Gemfile; I've run and re-run bundle install and bundle update; I've tried rc3, rc4 and now rc5; I'm running Ruby 1.9.2p290. Any ideas?
One workaround: include JavaScript files with the old-skool tag. For example, in my (Haml) layout:
= javascript_include_tag '/assets/jquery.js'
= javascript_include_tag '/assets/jquery_ujs.js'
= javascript_tag 'jQuery.noConflict();'
The /assets/ prefix tells Rails 3.1.x to look on the asset path, which includes gems, so you'll get the same files as with Sprockets directives. But you won't get concatenation or any other Sprockets preprocessing.
Still looking for better solutions.

Categories

Resources