From 2fdee4fbbdfe8e595e330fcb01d2a28ffb9681c9 Mon Sep 17 00:00:00 2001
From: Devon Reed <devon@weebly.com>
Date: Wed, 27 Jul 2016 12:22:29 -0400
Subject: [PATCH 1/2] Fixes header cell sorting classes for BackbonePageable
 collections

---
 src/body.js   |  6 ++++++
 src/header.js | 27 +++++++++++++++++++++------
 2 files changed, 27 insertions(+), 6 deletions(-)

diff --git a/src/body.js b/src/body.js
index 077245c6..69af332a 100644
--- a/src/body.js
+++ b/src/body.js
@@ -297,6 +297,12 @@ var Body = Backgrid.Body = Backbone.View.extend({
       collection.setSorting(order && column.get("name"), order,
                             {sortValue: column.sortValue()});
 
+      this.columns.each(function(model, index) {
+        if (model.get('name') !== column.get('name')) {
+          model.set('direction', null);
+        }
+      });
+
       if (collection.fullCollection) {
         // If order is null, pageable will remove the comparator on both sides,
         // in this case the default insertion order comparator needs to be
diff --git a/src/header.js b/src/header.js
index 26ecb12e..47f0e9fb 100644
--- a/src/header.js
+++ b/src/header.js
@@ -56,16 +56,31 @@ var HeaderCell = Backgrid.HeaderCell = Backbone.View.extend({
     if (Backgrid.callByNeed(column.sortable(), column, collection)) $el.addClass("sortable");
     if (Backgrid.callByNeed(column.renderable(), column, collection)) $el.addClass("renderable");
 
-    this.listenTo(collection.fullCollection || collection, "backgrid:sorted", this.removeCellDirection);
+    this.listenTo(collection.fullCollection || collection, "backgrid:sorted", this.refreshCellDirection);
   },
 
   /**
-     Event handler for the collection's `backgrid:sorted` event. Removes
-     all the CSS direction classes.
+     Event handler for the collection's `sort` event. Refreshes the CSS
+     direction classes.
    */
-  removeCellDirection: function () {
-    this.$el.removeClass("ascending").removeClass("descending");
-    this.column.set("direction", null);
+  refreshCellDirection: function (collection) {
+    // If this is a pageable collection and is in an active sort state,
+    // preserve the existing sort classes on related headers
+    if (Backbone.PageableCollection &&
+        collection instanceof Backbone.PageableCollection &&
+        this.$el.hasClass(collection.state.sortKey) &&
+        collection.state.order !== 0) {
+        if (collection.state.order > 0) {
+            this.$el.removeClass("ascending").addClass("descending");
+            this.column.set("direction", "descending");
+        } else {
+            this.$el.removeClass("descending").addClass("ascending");
+            this.column.set("direction", "ascending");
+        }
+    } else {
+        this.$el.removeClass("ascending").removeClass("descending");
+        this.column.set("direction", null);
+    }
   },
 
   /**

From 083e1e9b24d347d81a4bbb290646bde7984a208f Mon Sep 17 00:00:00 2001
From: devonreed <devonnigelreed@gmail.com>
Date: Wed, 27 Jul 2016 12:44:03 -0400
Subject: [PATCH 2/2] Fixes incorrect event name change in the
 refreshCellDirection docblock

---
 src/header.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/header.js b/src/header.js
index 47f0e9fb..f32fafd9 100644
--- a/src/header.js
+++ b/src/header.js
@@ -60,7 +60,7 @@ var HeaderCell = Backgrid.HeaderCell = Backbone.View.extend({
   },
 
   /**
-     Event handler for the collection's `sort` event. Refreshes the CSS
+     Event handler for the collection's `backgrid:sorted` event. Refreshes the CSS
      direction classes.
    */
   refreshCellDirection: function (collection) {