Grid.sort doesn't reset previously sorted column's sort caret on grids using pageable

[wyuenho]

Steps to reproduce:

1. go backgridjs.com
2. open the console
3. pageableGrid.sort("name", "descending");
4. pageableGrid.sort("pop", "ascending");
5. name's sort caret is still in descending order

Expected behavior:

name's sort caret should not be displayed and the column's direction shouldn't be null.

[eire1130]

Is it possible that this http://stackoverflow.com/questions/tagged/backgrid is related? I did bower install backgrid / backgrid-pagnitor late yesterday afternoon.

Also, when I put a debugger; in parseState debugger triggers twice per sort. However the init (page load) only triggers the debugger once.

Like I said in the question above, I'm new to backgrid but would be happy to provide anything you need if you believe this to be a defect and not a dev issue.

Here's the objects coming in to parse state:

queryParams
Object {currentPage: "page", pageSize: "size", totalPages: "total_pages", totalRecords: "total_entries", sortKey: "sort"…}
currentPage: "page"
directions: Object
order: "order"
pageSize: "size"
sortKey: "sort"
totalPages: "total_pages"
totalRecords: "total_entries"
__proto__: Object

state
Object {firstPage: 1, lastPage: 31559, currentPage: 1, pageSize: 10, totalPages: 31559…}
currentPage: 1
firstPage: 1
lastPage: 31559
order: -1
pageSize: 10
sortKey: "name"
totalPages: 31559
totalRecords: undefined
__proto__: Object

What's interesting here is "order" is now -1 and totalRecords is now undefined.

options
Object {from: 1, to: 1, url: "/search/cars/", data: Object, parse: true…}
add: true
data: Object
emulateHTTP: false
emulateJSON: false
error: function (resp) {
failure: function (){}
from: 1
merge: true
parse: true
remove: true
success: function (resp) {
to: 1
url: "/search/cars/"
xhr: Object
__proto__: Object

[wyuenho]

@eire1130 File a separate issue according to the guideline here.

[keeyip]

Calling collection.add directly causes the header cells to lose the ascending/descending classes.

function() {
    var coll1 = new Backbone.Collection(data1);

    var grid = new Backgrid.Grid({
        collection: coll1,
        columns: [
            {sortType:'toggle', name:'email', cell:'string', editable:false},
            {sortType:'toggle', name:'age', cell:'string', editable:false},
            {sortType:'toggle', name:'ageStr', cell:'string', editable:false},
            {sortType:'toggle', name:'address', cell:'string', editable:false},
        ]
    });

    grid.sort('age', 'descending');

    var $add = $('<button type="button">Add sorted</button>').click(function() {
        var id = _.uniqueId('autouser');
        var age = _.random(30,99);
        coll1.add({
            id: id,
            email: id + '@example.com',
            age: age,
            ageStr: '' + age,
            address: 'Somewhere'
        });
    });

    return $('<div>')
        .append($add)
        .append(grid.render().el);
}

[andrefrcastro]

I'm still experiencing this.
Have latest version of backgrid and all dependencies (via bower).

I'm using:

• backgrid
• backgrid-text-cell
• backbone-pageable
• backgrid-paginator
• backgrid-moment-cell
• backgrid-select-all
• backgrid-filter