Skip to content

Instantly share code, notes, and snippets.

@jkresner
Last active December 10, 2015 18:48
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jkresner/4477074 to your computer and use it in GitHub Desktop.
Save jkresner/4477074 to your computer and use it in GitHub Desktop.
Filtering, paging, sorting and searching collection with backbone.js
class FilteringAndPagingCollection extends Collection
pagesize: 25 # overriden in the child class
constructor: (args) ->
Backbone.Collection.prototype.constructor.apply(@, arguments) # called so backbone wires up & calls initialize
@filteredmodels = @models
@on 'reset', @resetfilteredmodels, @ # if the collection is reset, we need to reset the filtered version too
@on 'search sort', @resetpaging, @
resetfilteredmodels: ->
@filteredmodels = @models
@resetpaging()
resetpaging: ->
@totalpages = Math.ceil(@filteredmodels.length / @pagesize)
@currentpage = if @totalpages > 0 then 1 else 0
setpage: (page) -> #accepts numbers 1-N, number strings '1'-'N', and next('»')/prev('«')
if page is '»' && @currentpage < @totalpages then @setpage @currentpage+1
else if page is '«' && @currentpage > 1 then @setpage @currentpage-1
else
page = parseInt page
if page <= @totalpages && page > 0
@currentpage = page
@trigger('page')
fetchpage: ->
start = @pagesize * (@currentpage - 1)
_.first _.rest(@filteredmodels, start), @pagesize
filteredsort: (attr, direction, type) ->
if direction is 'up' then @comparator = (m) -> m.get(attr)
else if type is 'String' then @comparator = (m) -> comparators.reversestring(m, attr)
else if type is 'Number' then @comparator = (m) -> -1 * m.get(attr)
else if type is 'Boolean' then @comparator = (m) -> -1 * m.get(attr)
@filteredmodels = _.sortBy @filteredmodels, @comparator
@trigger 'sort'
filtersearch: (term) ->
# orverride / implement your own search in child class
if term is '' then @filteredmodels = @models
else
pattern = new RegExp term, "gi"
@filteredmodels = @filter (m) ->
pattern.test(m.get("first_name"))
@trigger 'search'
# http://stackoverflow.com/questions/5636812/sorting-strings-in-reverse-order-with-backbone-js
comparators =
reversestring: (m, attr) ->
String.fromCharCode.apply String, _.map(m.get(attr).split(""), (c) -> 0xffff - c.charCodeAt() )
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment