jquery ui doesn't work with rails 4

Question

Use jQuery UI with rails 4.2.3. And it doesn't work for me.

Use gem "jquery-ui-rails".

Try to make a simple draggable element like this https://jqueryui.com/draggable/#default

But I can't move my div element.

<div id = "draggable" class="ui-widget-content">
  <p>Element</p>
</div>

my apllication.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require twitter/bootstrap
//= require turbolinks
//= require_tree .

$("#draggable").draggable();

apllication.css

*= require jquery-ui
*= require_tree .
*= require_self
 */

#draggable{width:110px;height:100px; padding:0.5em; border:1px solid #ddd; background-color:#eee}

Test in Firefox and Chrome.

I tried to precompile assets, cleaned up all old gems. And tried to manually plug in layout(when i made it I delete jquery lines in application.js )

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

Browser doesn't show any mistakes. All jquery-ui files I can see in assets/jquery-ui when use Development tools in browser.

Help. Where is my mistake?

Roope Hakulinen · Accepted Answer · 2015-08-22 18:55:54Z

2

The problem most probably is that you try to run the code before the DOM is completely loaded and thus it can't even find the $("#draggable"). Change the

$("#draggable").draggable();

to

$(function() {
  $("#draggable").draggable();
});

which will load for DOM to get fully loaded before calling draggable.

answered Aug 22, 2015 at 18:55

Roope Hakulinen

7,4056 gold badges46 silver badges66 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jquery ui doesn't work with rails 4

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related