Hello Everyone,
I've spent some time over the past few weeks putting together a reactive DataTables component for MeteorJS that allows you to page, sort, and filter millions of records while maintaining meteor's awesome server / client reactivity.
The packages is hosted on Meteor's package repository [ AtmosphereJS ]( https://atmospherejs.com/package/luma-datatables )
[ Here is a Live Example ]( http://luma-datatables.meteor.com/ )
[ Here is the Annotated Source ]( http://lumapictures.github.io/luma-datatables/ )
Any input is appreciated, and pull requests are more than welcome!
Setting up the component is simple :
1. Define the component in your template
2. Setup the data in your controller or as template helpers
3. Publish data on the server ( coffeescript )
I've spent some time over the past few weeks putting together a reactive DataTables component for MeteorJS that allows you to page, sort, and filter millions of records while maintaining meteor's awesome server / client reactivity.
The packages is hosted on Meteor's package repository [ AtmosphereJS ]( https://atmospherejs.com/package/luma-datatables )
[ Here is a Live Example ]( http://luma-datatables.meteor.com/ )
[ Here is the Annotated Source ]( http://lumapictures.github.io/luma-datatables/ )
Any input is appreciated, and pull requests are more than welcome!
Setting up the component is simple :
1. Define the component in your template
{{> dataTable selector=browsers.selector columns=browsers.columns collection=browsers.collection options=browsers.options subscription=browsers.subscription query=browsers.query }}
2. Setup the data in your controller or as template helpers
if Meteor.isClient Template.home.browsers = columns: [ { sTitle: "Engine" mData: "engine" } { sTitle: "Browser" mData: "browser" } { sTitle: "Platform" mData: "platform" } { sTitle: "Version" mData: "version" sClass: "center" } { sTitle: "Grade" mData: "grade" sClass: "center" mRender: ( dataSource, call, rawData ) -> rawData ?= "" switch rawData.grade when "A" then return "<b>A</b>" else return rawData.grade } { sTitle: "Created" mData: "createdAt" mRender: ( dataSource, call, rawData ) -> rawData.createdAt ?= "" if rawData.createdAt return moment( rawData.createdAt ).fromNow() else return rawData.createdAt } { sTitle: "Counter" mData: "counter" } ] selector: "dataTable-browsers" collection: Browsers subscription: "all_browsers" options: oLanguage: sProcessing: "You must build construct additional pylons!" query: grade: "A"
3. Publish data on the server ( coffeescript )
if Meteor.isServer DataTable.debug = "true" DataTable.publish "all_browsers", Browsers