[SOLVED]Ember-cli: How to initialize jquery plugins?


#1

I am just getting up to speed with ember-cli and I am trying to initialize a jquery plugin called raty. I keep getting a Unexpected token : error when I place it in an of my js app.imports . I also tried using the didInsertElement: method with no luck. Heres my initialization code $('.sidebar-element-rating').raty( number: function() {return $(this).attr('data-number'); },path: 'assets/images');. Any help would be greatly appreciated.


#2

While you’ve included some code, it might be more helpful to put this in a JSBin that others can play around with it. Also, you can format your code a little better by wrapping it with 3 backticks in Github fashion:

$('.sidebar-element-rating').raty( 
  number: function() {
    return $(this).attr('data-number'); 
  },
  path: 'assets/images'
);

Based on the docs, it seems like you need to be passing an object to the raty function:

$('.sidebar-element-rating').raty({ 
  number: function() {
    return $(this).attr('data-number'); 
  },
  path: 'assets/images'
});

Your approach sounded fine otherwise.


#3

At first I didn’t see any difference between our code segments. Only after some careful looking did I notice the missing curly brackets in my code. Thank you so much. Now the error is gone but the code doesn’t work. Is there something special I have to do to get jquery and javascript plugins to work with ember-cli? I seem to be fighting against this problem over and over (since I am a heavy jquery user) and need a clearly defined guide on this. For instance I use foundation and the scss works fine (well now it does after I had to tweak things for a week) but the .js only works if I don’t use the return this.store.find(); method in my routes model.


#4

Are you sure that your jquery plugin is being loaded? How are you including it in your application? You can see the documentation for how to include vendor javascript (i.e. jquery plugins and other libraries) here.


#5

Yep everything is there. And the jquery plugin works like a charm until I add the model in the route. Then it doesn’t work.


#6

So there’s obviously something wrong with your model hook if adding that in is breaking things. Once again, you may want to consider putting up a JSBin that showcases that particular issue. Do you get a certain error message? In your example, it looks like you’re calling .find without any arguments.


#7

I ended up getting the answers to my question on this thread. Thank you so much for you help with the plugins. Cheers!

Mooror