https://github.com/crodriguez1a/ember-sort-filter-table

A sortable/searchable table addon for ember cli
https://github.com/crodriguez1a/ember-sort-filter-table

ember ember-data filtering search sorting table

Last synced: about 1 month ago
JSON representation

A sortable/searchable table addon for ember cli

• Host: GitHub
• URL: https://github.com/crodriguez1a/ember-sort-filter-table
• Owner: crodriguez1a
• License: mit
• Archived: true
• Created: 2015-08-05T15:30:24.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2017-10-22T15:45:18.000Z (about 7 years ago)
• Last Synced: 2024-04-24T08:31:08.259Z (7 months ago)
• Topics: ember, ember-data, filtering, search, sorting, table
• Language: JavaScript
• Homepage: http://crodriguez1a.github.io/ember-sort-filter-table/
• Size: 1.55 MB
• Stars: 12
• Watchers: 4
• Forks: 6
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
[![npm version](https://badge.fury.io/js/ember-sort-filter-table.svg)](https://badge.fury.io/js/ember-sort-filter-table)

[![Build Status](https://travis-ci.org/crodriguez1a/ember-sort-filter-table.svg?branch=master)](https://travis-ci.org/crodriguez1a/ember-sort-filter-table)

[![Ember Observer Score](http://emberobserver.com/badges/ember-sort-filter-table.svg)](https://emberobserver.com/addons/ember-sort-filter-table)

# ember-sort-filter-table

A table add-on for Ember-CLI with sorting and filtering. [Full Documentation & Demo](http://crodriguez1a.github.io/ember-sort-filter-table)

## Installation

		ember install ember-sort-filter-table

## Usage

Simply pass an array of objects as the **table** parameter to the component. Use the key **rows** to define your array as follows:

		/**

		  .js

		  Defining a model that my table will display

		*/

		let model = {

		  rows: [

		    {

		      Tables: 'zebra stripes',

		      Are: 'are neat',

		      Cool: '$1'

		     }

		   ]

		 };		 

		...

		{{! some-template.hbs }}

		{{component "sort-filter-table" table=model}}

The addon will assemble the table headers from the object keys and display a table like this:

| [Tables](#)        | [Are](#)           | [Cool](#) |

| ------------- |:-------------:| -----:|

| zebra stripes | are neat      |    $1 |

If your model has properties that should not be displayed in the table, use an underscore to mark that property as private.

		let model = {

		  rows:[

		    {

		      name: 'Carlos Rodriguez',

		      github_id: 'crodriguez1a',

		      _writesCode: true

		    }

		  ]

		};

The model above would display like this:

| [name](#)        | [github id](#)           |

| ------------- |:-------------:|

| Carlos Rodriguez | crodriguez1a      |

## Contribute

Collaboration is welcome and greatly appreciated. To collaborate on this project, follow the instructions that follow.

## Installation

* `git clone` this repository

* `npm install`

* `bower install`

## Running

* `ember server`

* Visit your app at http://localhost:4200.

## Running Tests

* `ember test`

* `ember test --server`

## Building

* `ember build`

For more information on using ember-cli, visit [http://www.ember-cli.com/](http://www.ember-cli.com/).