This project is a lightweight table/grid builder. It is meant to be easy configurable but also easy customisable (if you want to use it as a base for your own grid development). In The current version (0.1.0) the features are
You'll find running examples and more documentation at the demo website
smartTable.table
to your own app module. The build includes all the template in the $templateCache so you need only this file.bower install smart-table
Directives.js
file. This part is not tested and is more an “experimental” branch" I have a huge set of data which I want to be loaded in the browser only on demand, how can I do that ?"
This is somehow server-side pagination
. You load the data on demand but keep the rest of the logic on the client side (sort,filter,...) This branch show you how to turn smart-table to be able to have this particular flow (~10 lines to change)
If you want to adapt smart-table to your own flow, it is really easy. But first you should understand how it works, so you will know what to change to customise it.
The Table.js
file is the key. When you bind a dataCollection to the smart table directive
<smart-table rows="dataCollection" columns="myColumns"></smart-table>
the table controller (Table.js) will have access to this data collection through the scope. This controller provides an API which table child directives (Directives.js
) will be able to call. Through this API calls, the controller will perform some operations on the dataCollection (sort,filter, etc) to build a subset of dataCollection (displayedCollection) which is the actual displayed data. Most of the API method simply change table controller or scope variables and then call the pipe
function which will actually chain the operations to build the subset (displayedCollection) and regarding to the updated local/scope variables. The Column.js
simply wraps (and add some required properties) to your column configuration to expose it to the table child directives through the scope.
So, at the end you don't even have to use the provided directives and build yours if you want a special behavior.
###The build process
npm install
to install the required node modules.grunt build
it will perform the following operations:Template.js
file.grunt refApp
the two first steps are the same that the build task, but at the end it will simply copy the Smart-Table.debug.js into the example-app folder (see below)The example app is a running example of the smart-table in action. To run it :
scripts/web-server.js
Unit tests are provided for all the code except for Directive.js file which is a bit more experimental. Tests can be run with Testacular: you'll find the config file under config folder. Note, the coverage is done by Istanbul.js
Smart Table module is under MIT license:
Copyright (C) 2013 Laurent Renard.
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
For more information on Smart Table, please contact the author at laurent34azerty@gmail.com