Question

I am trying to introduce pagination using the backbone.js paginator plugin‘s requestPager.

Problem: After setting up the collection which extends Backbone.Paginator.requestPager, I refreshed the webpage and the javascript console threw the error:

Uncaught TypeError: Object function (a){return new m(a)} has no method 'result' backbone.paginator.js:678

I am very new to backbone and is not sure what went wrong. Is it because I used fetch(), which showed up in the screenshot of the error below? I also noticed that no GET requests were sent to the backend. What happened, and how should I fix this? Thanks!

JS code

// Collection

window.ListingCollection = Backbone.Paginator.requestPager.extend({
    model: Listing,

    paginator_core: {
        type: 'GET',
        dataType: 'jsonp',
        url: 'api/listings'
    },

    paginator_ui: {
        firstPage: 0,
        currentPage: 0,
        perPage: 10,
        totalPages: 10
    },

    server_api: {
        '$filter': '',
        '$per_page': function() { return this.perPage; },
        '$current_row': function() { return this.currentPage * this.perPage; },
        '$order_by': 'listing_id'
    },

    parse: function(response){
        this.totalPages = Math.floor(response.total_rows / this.perPage);
    }

});

JS Code

// Router
var AppRouter = Backbone.Router.extend({
    routes: {
        '': 'listings',
        'listings': 'listings'
    },

    listings: function() {
        var self = this;

        // Load initial search results
        this.listingList = new ListingCollection();
        this.listingList.fetch({
            success: function() {
                self.listingListView = new ListingListView({ model: self.listingList });
                $('#listing_list table').append(self.listingListView.render().el);
            }
        });
        this.listingFilterView = new ListingFilterView();
    }
});

Screenshot of Error in Javascript Console

JS Includes

<!-- JavaScript -->
<script src="assets/js/lib/jquery-1.7.1.min.js"></script>
<script src="assets/js/lib/underscore-min.js"></script>
<script src="assets/js/lib/backbone-min.js"></script>
<script src="assets/js/lib/backbone.paginator.js"></script>
<script src="assets/js/lib/bootstrap.js"></script>
<script src="assets/js/lib/bootstrap-datepicker.js"></script>
<script src="assets/js/app.js"></script>   

Answer 1

You are probably using older version of Underscore. I use 1.3.1 and it does not have result() method. Download their new production version 1.3.3 – it has result().