Search code examples
javascriptjqueryjquery-uibackbone.jstwitter-bootstrap

Slider cannot be dragged (Cannot call method 'addClass' of undefined ) (jQuery UI Bootstrap + Twitter Bootstrap)

When I create a simple slider #slider using Twitter Bootstrap 2.1.1, jQuery UI Bootstrap 1.8.16 and Backbone.js, I get the following error when I try to drag the slider handle (which does not follow the drag):

JS Error

Uncaught TypeError: Cannot call method 'addClass' of undefined

HTML

<div id="slider"></div>

JS

renderSlider: function() {
    this.$el.find('#slider').slider({
        range: true,
        min: 0,
        max: 500,
        values: [ 75, 300 ],
        slide: function( event, ui ) {}
    });

},

I get the same error when I drag the slider handle if I don't pass any options to .slider():

renderSlider: function() {
    this.$el.find('#slider').slider();

Any idea what went wrong?

Solution

  • Use jQuery 1.8.x. Theres a incompatibility issue with the version you've chosen.