You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 4-6.RSVP
Socket
Book a DemoInstallSign in
Socket

ember-table-it

Package Overview
Dependencies
Maintainers
1
Versions
9
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ember-table-it

An ember-addon for implementing tables with support for pagination

0.0.8
latest
Source
npmnpm
Version published
Weekly downloads
1
-83.33%
Maintainers
1
Weekly downloads
 
Created
Source

ember-table-it

{{table-it}} component addon for simple table construction using Bootstrap 3

Ember-table-it

Simple table example

Dependencies

  • Bootstrap 3 for style
  • Ember-data This library assumes to be working with Ember-data

Getting Started

Install via ember-cli, ember install:addon ember-table-it, then use in your app.

Available Options

Required

  • columns: An array of column identifications. label is the text to show and name is the attribute name to pull from model
[
  {
    label: 'ID',
    name: 'id'
  }, {
    label: 'Name',
    name: 'name'
  }, {
    label: 'Birthday',
    name: 'dob'
  }
];
  • rows: Model collection

Optional

  • action: Handler for the setPage action that gets raised during pagination

Following outlines the details of collaborating on this Ember addon.

Quick Example

Assuming we have a simple model called user. And we wanted to display them paginated.

NOTE For pagination to work, you have to have meta data called total_pages in your response from server. See serializers for converting meta data if your server is returning different attribute for number of total pages

NOTE 2 Pagination has to be applied to the models and handled by the calling controller/component

After you set your model in your route. In your controller or component

import Ember from 'ember'

export default Ember.Controller.extend(
  columns: 
    [
      {
        label: 'ID',
        name: 'id'
      }, {
        label: 'Name',
        name: 'name'
      }, {
        label: 'Birthday',
        name: 'dob'
      }
    ];
  actions: {
    setPage: function(pageNum){
      this.set('users', this.store.find('user'), { page: pageNum });
    }
  }
);

In the corresponding template

{{table-it columns=columns rows=rows action="setPage"}}

This will fully render the data.

Installation

  • git clone this repository
  • npm install
  • bower install

Running

Running Tests

Unit tests aren't completed yet

  • ember test
  • ember test --server

Building

  • ember build

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

Keywords

ember-addon

FAQs

Package last updated on 08 Apr 2015

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts