CODEWITHSUNDEEP
jquerybackbone.jsjquery-cycle
vikmalhotra
vikmalhotra

Reputation: 10071

jquery cycle plugin: pager not working

I'm using the jquery cycle plugin and backbone.js in my webapp. I'm initiating the pager in one of my Backbone views. Here's how I'm doing it right now...

var SlideView = Backbone.View.extend({
    template: _.template($('#SlideViewTemplate').html()),
    initialize: function() {
        _.bindAll(this, 'render');
        this.render();
    },
    render: function() {
        return $(this.el).html(this.template(this.model.toJSON()));
    }
});

var SlideListView = Backbone.View.extend({
    el: $('#SlideNavi'),

    initialize: function() {
        _.bindAll(this, 'render', 'populate');
        this.render();
    },
    render: function() {
        _(this.collection.models).each(function(item) {
            this.populate(item);
        }, this);

        $('#Slideshow').cycle({
            fx: 'fade',
            pager: '#SlideNavi'
        });
    },
    populateChildren: function(slide) {
        var itemView = new SlideView({
            model: slide
        });
        $(this.el).append(itemView.render());
    }
});
new SlideListView({collection: someCollection});

Here's my view template, nothing fancy:

<script type="text/template" id="SlideViewTemplate">
    <%= name %>
</script>

Here's how the view looks after being populated:

<div class="SlideNavi">
    <div>Service1</div>
    <div>Service2</div>
    <div>Service3</div>
    <div>Service4</div>
</div>

Now, el used in SlideListView is empty when the page is loaded. But after the view has been populated I call upon the jquery cycle plugin to start the slideshow. The thing is that slideshow is working, but the pager is not. No activeClass is being added to pager elements as shown in this demo....

What am I missing over here?

Upvotes: 0

Views: 1051

Answers (1)

vikmalhotra
vikmalhotra

Reputation: 10071

I found the answer over here. Make sure to include jquery.cycle.all.js, not jquery.cycle.lite.js.

Upvotes: 3

Related Questions