Edward
Edward

Reputation: 3499

Activeadmin stops my jQuery working

I'm using jquery drag and drop in my app and it works fine.

I then added activeadmin and it stops my jquery working.

I get this error

$(".draggable_article_image").draggable is not a function

If I remove this line from active_admin.js

//= require active_admin/base

it starts working again.

Any ideas?

Upvotes: 10

Views: 5136

Answers (3)

Lucien Boix
Lucien Boix

Reputation: 1009

Try moving your active_admin.js file to the vendor/assets/javascripts folder of your Rails project : you should be fine.

Please let us know if it helped someone!

Regards

Upvotes: 12

The Whiz of Oz
The Whiz of Oz

Reputation: 7043

I had an error with the code above, so I tweaked mine a bit:

active admin init:

  config.clear_javascripts!
  config.register_javascript 'admin/active_admin.js'

  current_javascripts = config.javascripts.clone
  config.clear_javascripts!
  config.register_javascript 'application.js'
  current_javascripts.each{ |j| config.register_javascript j }

active admin js

  //= require active_admin/base

That's it!

Upvotes: -1

ReggieB
ReggieB

Reputation: 8212

If you look at the activeadmin base manifest file you'll see where the additional jquery load is called. The last call in the base manifest is to the activeadmin application manifest. Therefore there is an easy way to bypass the unwanted additional jquery load.

Change this line in you application's /app/assets/javascripts/active_admin.js:

//= require active_admin/base

To

//= require active_admin/application

That way active admin's javascript code will be loaded without reloading jquery.

Within the /admin space, active admin loads active_admin.js without loading application.js, so you need to load application.js there too. To work, you need to make active admin load application.js before active_admin.js. Add this to config/initializers/active_admin.rb:

current_javascripts = config.javascripts.clone
config.clear_javascripts! 
config.register_javascript 'application.js'
current_javascripts.reverse.each{|j| config.register_javascript j}

However, note that for this to work seamlessly, you may need all these declarations in your app's application.js manifest:

//= require jquery
//= require jquery-ui
//= require jquery_ujs

Also as application.js is being loaded within active admin, you need to manage any namespace conflicts yourself.

Upvotes: 11

Related Questions