A React.js Table Sorter Component
A sortable table component using Facebook's React. Build out as a reusable component from the demo made by bgerm.
Features:
- Remote data loading
- Sortable columns
- Filterable columns
- Repeatable headers
Usage
Sortable Table takes two arguments, source and config. source is a string designating the path to a JSON formatted data source and config is a JavaScript object containing information about the structure of the table.
Example
var CONFIG = {
sort: { column: "col2", order: "desc" },
columns: {
col1: { name: "Col1", filterText: "", defaultSortOrder: "desc"},
col2: { name: "Col2", filterText: "", defaultSortOrder: "desc"},
col3: { name: "Col3", filterText: "", defaultSortOrder: "desc"}
}
};
React.renderComponent(<TableSorter dataSource="/api/data.json" config={CONFIG} headerRepeat="5" />, document.getElementById("table-sorter"));
Running the Demo
lute is a quick solution.
npm install -g lute
lute
And now view at: http://localhost:8080/example.