Backgrid.js - (Re)orderable columns

Warning! This extension is not production ready yet, just a mere proof of concept. It lacks documentation, automatic testing and edge-case tests.

To discuss this extension, see this backgrid issue.

Demo

Online demo of can be found here

Browser support (tested)

- IE8+
- Firefox
- Chrome

Features

- Order columns based on 'position' attribute
- Dependency: backgrid-sizeable-columns
- Supports grouped columns

$3

``javascript
// Setup sortable column collection
var columnCollection = Backgrid.Columns.extend({
sortKey: "position",
comparator: function(item) {
return item.get(this.sortKey) || 999;
},
setPositions: function() {
_.each(this.models, function(model, index) {
model.set("position", index + 1, {silent: true});
});

return this;
}
});
var columns = new columnCollection(columnsArray);
columns.setPositions().sort();

// Add sizeable columns
var sizeAbleCol = new Backgrid.Extension.sizeAbleColumns({
collection: pageableTerritories,
columns: columns
});
$backgridContainer.find('thead').before(sizeAbleCol.render().el);

// Make columns reorderable
var orderHandler = new Backgrid.Extension.OrderableColumns({
grid: pageableGrid,
sizeAbleColumns: sizeAbleCol
});
$backgridContainer.find('thead').before(orderHandler.render().el);
``

License

Copyright © 2014 Fortes Solutions.

Licensed under the MIT license.

Authors

This extension was created by Wilbert van de Ridder and is currently maintained by Fortes Solutions Team.