custom comparator

[larryhengl]

Question: what would be the canonical approach to implementing a custom sort comparator for PageableCollections in Client mode? Looking to use an ignoreCase sorting fn for strings. Tried overriding the comparator in the collection def, but it seems to fallback to native or _cid sorting. Tried to extend the HeaderCell view and pass in a new comparator def there, but not yet successful. What would be your approach? Many thanks!

[carlygeehr]

Each cell in my grid can be a string, JSON object, or array, so I definitely needed a custom comparator - I ran into similar issues and ended up just having to modify the _makeComparator function in backbone-pageable.js. Probably not the "right" way to do it, but it worked for me...

I'd love to hear solutions from others who've done a custom comparator.

[wyuenho]

@gbedardsice has asked a similar question recently: backbone-paginator/backbone-pageable#89

This seems to be a recurring issue for a couple of people of late. Suggestions on how to improve this is welcomed.

[thomasfl]

This may be a bit off topic, but I simply want case insensitive column sorting.

I would prefer to have "comparator : function(a,b){...}" as a column option, but any hints on how to do this without modifying backgrid would be appreciated.

[gbedardsice]

The problem I see with passing a custom comparator function is that it depends on the column. It would have to be a dumbed down comparator that doesn't consider left and right as models, but as attributes.

[thomasfl]

What about passing sorting: 'caseinsensitive' | 'numeric' | 'date' instead? It's not as flexible, but it would save my day. ;-)

[wyuenho]

How about this?

columns: [
  name: "name",
  label: "Name",

  // Put your custom logic that returns a comparator function based on the direction here
  // Similar to Backbone.PagableCollection#_makeComparator
  comparatorProvider: function (attr, order) {
    return function (left, right) {

      // no-op
      if (order == null) return 0;

      var l = left.get(attr), r = right.get(attr), t;

      // if descending order, swap left and right
      if (order === 1) t = l, l = r, r = t;

      // compare as usual
      if (l === r) return 0;
      else if (l < r) return -1;
      return 1;
    }
  }
]

This should help folks who are dealing with nested data who only have Formatters to use to display them but not sort them.

[gbedardsice]

This could work, but why would this logic (the swapping of left and right) ever change? Why not have it built in inside HeaderCell?. Let me build up a commit real fast, I'll show you what I mean.

[wyuenho]

Are you thinking of a function that lets you extract the values from the models?

[gbedardsice]

What do you think of something like that? Keep in mind this is not tested at all, just a quick mockup.

[gbedardsice]

The only ambiguity I see with this is that the comparator option you would pass to the HeaderCell is not a typical Backbone.Collection comparator. it's a generic version that compares the two raw values instead of the two models.

[gbedardsice]

Also see this commit: backbone-paginator/backbone-pageable@02a0819

[wyuenho]

I'm thinking along similar lines. I think most people will only have trouble with this line:

var l = left.get(attr), r = right.get(attr), t;

That's pretty much the only line they'll have to customize, the rest should be the same for everyone. How about just a value extractor that you can provide to the column definition?

BTW, that commit you just posted looks like it's coming from backbone-pageable's repo, how did you do that?

[gbedardsice]

How about just a value extractor that you can provide to the column definition?

Are you talking about something like this?

var l = left.get(this.column.modelAttribute()), r = right.get(this.column.modelAttribute())

BTW, that commit you just posted looks like it's coming from backbone-pageable's repo, how did you do that?

The same way you linked to the backbone-pageable issue, except you replace the issue number (#89) with @ followed by the commit hash (@02a0819) !