Merge pull request #35 from SitePenKenFranqueiro/sort-refactor

Refactor sort to additionally support passing a sort options array
SitePen · Oct 20, 2011 · e649f7b · e649f7b
2 parents dcff8c2 + 8b9883b
commit e649f7b
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 12 deletions.
diff --git a/Grid.js b/Grid.js
@@ -258,14 +258,22 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "./Edit
  // summary:
  // Extension of List.js sort to update sort arrow in UI
 
+ var prop = property, desc = descending;
+
+ // If a full-on sort array was passed, only handle the first criteria
+ if(typeof property != "string"){
+ prop = property[0].attribute;
+ desc = property[0].descending;
+ }
+
  // if we were invoked from a header cell click handler, grab
  // stashed target node; otherwise (e.g. direct sort call) need to look up
  var target = this._sortNode, columns, column, i;
  if(!target){
  columns = this.columns;
  for(i in columns){
  column = columns[i];
- if(column.field == property){
+ if(column.field == prop){
  target = column.headerNode;
  }
  }
@@ -282,7 +290,7 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "./Edit
  // place sort arrow under clicked node, and add up/down sort class
  this._lastSortedArrow = put(target.firstChild, "-div.dgrid-sort-arrow.ui-icon[role=presentation]");
  this._lastSortedArrow.innerHTML = "&nbsp;";
- put(target, descending ? ".dgrid-sort-down" : ".dgrid-sort-up");
+ put(target, desc ? ".dgrid-sort-down" : ".dgrid-sort-up");
  // call resize in case relocation of sort arrow caused any height changes
  this.resize();
 

diff --git a/List.js b/List.js
@@ -400,9 +400,25 @@ function(put, declare, listen, aspect, has, TouchScroll, hasClass){
  sort: function(property, descending){
  // summary:
  // Sort the content
- this.sortOrder = [{attribute: property, descending: descending}];
+ // property: String|Array
+ // String specifying field to sort by, or actual array of objects
+ // with attribute and descending properties
+ // descending: boolean
+ // In the case where property is a string, this argument
+ // specifies whether to sort ascending (false) or descending (true)
+
+ this.sortOrder = typeof property != "string" ? property :
+ [{attribute: property, descending: descending}];
  this.refresh();
+
  if(this.lastCollection){
+ // if an array was passed in, flatten to just first sort attribute
+ // for default array sort logic
+ if(typeof property != "string"){
+ descending = property[0].descending;
+ property = property[0].attribute;
+ }
+
  this.lastCollection.sort(function(a,b){
  var aVal = a[property], bVal = b[property];
  // fall back undefined values to "" for more consistent behavior

diff --git a/OnDemandList.js b/OnDemandList.js
@@ -47,13 +47,16 @@ return declare([List], {
  // summary:
  // Assigns a new query (and optionally queryOptions) to the list,
  // and tells it to refresh.
+
+ var sort = queryOptions && queryOptions.sort;
+
  this.query = query !== undefined ? query : this.query;
  this.queryOptions = queryOptions || this.queryOptions;
- // stash sort details if the queryOptions included them
- if(queryOptions && queryOptions.sort){
-  this.sortOrder = queryOptions.sort;
- }
- this.refresh();
+
+ // If we have new sort criteria, pass them through sort
+ // (which will update sortOrder and call refresh in itself).
+ // Otherwise, just refresh.
+ sort ? this.sort(sort) : this.refresh();
  },
 
  renderQuery: function(query, preloadNode){

diff --git a/test/test_OnDemand.html b/test/test_OnDemand.html
@@ -202,12 +202,14 @@
  }
  sortByCol1.descending = sortDescending;
  grid.setQuery(grid.query, { sort: [sortByCol1] });
+
+ console.log("sortOrder after setQuery: ", grid.sortOrder, grid.queryOptions);
  });
  on(document.getElementById("sort"), "click", function(){
- console.log("sortOrder: ", grid.sortOrder);
-
  sortDescending ^= 1; // toggle true/false
  grid.sort("col1", sortDescending);
+
+ console.log("sortOrder after sort: ", grid.sortOrder);
  });
 
 
@@ -290,12 +292,13 @@
  <body class="claro">
  <h2>Simple test to show setting a new store and query to dgrid</h2>
  <div id="grid"></div>
- <button id="setstore">Set Color Store</button>
- <button id="restore">Set Original Store</button>
  <button id="colorQuery">Set color store and query</button>
  <button id="resetQuery">Reset query</button>
  <button id="setQueryWithOptions">Set query with queryOptions</button>
  <button id="sort">sort</button>
+ <br>
+ <button id="setstore">Set Color Store</button>
+ <button id="restore">Set Original Store</button>
  <button id="empty">Set to empty store</button>
  <button id="error">Set to error store</button>
  <button id="error2">Set to error store (def)</button>