Top level collection of a Backbone.js model won't sort

manpreet Best Answer 2 years ago

I'm working on my first Backbone.js app and have run into some weird behavior that I'm concerned could indicate a problem in my design. My data looks like this:

Syllabus
    Dance
        Figure
        Figure
        Figure
    Dance
        Figure
        Figure
    etc.

I have created this model to represent it:

$.syllabus.Syllabus = Backbone.RelationalModel.extend({
    urlRoot: '/api/syllabus',
    idAttribute: 'id',
    relations: [{
        type: Backbone.HasMany,
        key: 'danceAssignments',
        relatedModel: '$.syllabus.DanceAssignment',
        collectionType: '$.syllabus.DanceAssignmentCollection',
        reverseRelation: {
            key: 'syllabus',
            includeInJSON: 'id'
        }
    }]
});

$.syllabus.DanceAssignment = Backbone.RelationalModel.extend({
    urlRoot: '/api/danceassignments',
    idAttribute: 'id',
    relations: [{
        type: Backbone.HasMany,
        key: 'figureAssignments',
        relatedModel: '$.syllabus.FigureAssignment',
        collectionType: '$.syllabus.FigureAssignmentCollection',
        reverseRelation: {
            key: 'danceAssignment',
            includeInJSON: 'id'
        }
    }],
});

$.syllabus.DanceAssignmentCollection = Backbone.Collection.extend({
    model: $.syllabus.DanceAssignment,
    urlRoot: '/api/danceassignments',

    comparator: function(danceAssignment) {
        return danceAssignment.get('index');
    },
});

$.syllabus.FigureAssignment = Backbone.RelationalModel.extend({
    urlRoot: '/api/figureassignments',
    idAttribute: 'id'
});

$.syllabus.FigureAssignmentCollection = Backbone.Collection.extend({
    model: $.syllabus.FigureAssignment,
    url: '/api/figureassignments',

    comparator: function(figureAssignment) {
        return figureAssignment.get('index');
    },
});

The FigureAssignmentCollection is sorting automatically when I change the index property of one of its members, but the DanceAssignmentCollection isn't, nor does it sort when I explicitly tell it to. The comparator is called, but if I print out the contents of the collection after the sort they're in the wrong order, and the interface renders them out of order.

Any thoughts?

manpreet 2 years ago