带有Ember CLI的jQuery UI

Question

So I'm pretty much having the exact problem listed here: Using jquery in Ember-cli

But I've already done the following as recommended in the thread above:

Added:

app.import('bower_components/jquery-ui/jquery-ui.js');
app.import('bower_components/jquery-ui/ui/tooltip.js');

Changed

Ember.$(selector).tooltip();

to

this.$(selector).tooltip();

Ember isn't recognizing the tooltip function as being defined despite UI being installed and doing the above.

Error:

Uncaught TypeError: undefined is not a function

Any help?

Answer 1

A few things. First, jquery-ui.js is the entire jQuery UI library. So, you've already got tooltip in there. Remove that second line.

If you only want the tooltip, you'll need to import core , widget and position separately ( reference ), and then the tooltip .

Finally, you probably want to include a theme. The default one lives here:

app.import('bower_components/jquery-ui/themes/smoothness/jquery-ui.min.css');

With that, stick the this.$().tooltip() in your view's didInsertElement callback and you should be good to go.

Answer 2

The problem was I had imported Ember Data which was causing an error (apparently it's imported by default or the options were stated incorrectly). Once I removed that, UI is now working properly.

Thank you for all your help Sam!