Need help with ember-models-table?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

onechiporenko
213 Stars 118 Forks MIT License 505 Commits 3 Opened issues

Description

Table with pagination, sorting, filtering and much more

Services available

!
?

Need anything else?

Contributors list

# 231,598
Shell
JavaScr...
HTML
Ember
168 commits
# 111,201
Dart
Ember
jsonapi
gRPC
7 commits
# 378,793
Ember
PHP
HTML
ember-a...
7 commits
# 530,678
Ember
ember-a...
HTML
Shell
5 commits
# 82,929
Shell
Ember
Vue.js
Lua
4 commits
# 70,180
Ember
HTML
ESLint
CSS
3 commits
# 189,486
Ember
HTML
antdesi...
SQL
3 commits
# 28,400
CSS
Shell
javascr...
Ember
2 commits
# 623,904
Ember
ember-a...
HTML
Shell
2 commits
# 266,160
Ember
HTML
Shell
telegra...
2 commits
# 235,809
PHP
event-l...
reactph...
Ember
1 commit
# 595,352
TypeScr...
Ember
ember-a...
HTML
1 commit
# 33,813
JavaScr...
TypeScr...
Ember
Chrome
1 commit
# 14,342
bracket...
textmat...
alfred
Sublime...
1 commit
# 684,318
Ember
ember-a...
JavaScr...
HTML
1 commit
# 693,554
Ember
ember-a...
JavaScr...
HTML
1 commit
# 693,555
Ember
ember-a...
JavaScr...
HTML
1 commit
# 379,246
Ember
ember-a...
HTML
Shell
1 commit
# 19,397
Ember
postgre...
gzip
ember-c...
1 commit
# 671,532
Ember
ember-a...
JavaScr...
HTML
1 commit

Ember-models-table

Build Status Coverage Status Codacy Badge Ember Observer Score npm version License Downloads

Install

ember install ember-models-table

Discussion

Join the official Ember Discord server.

Usage

Major version 3.x is latest version of

ember-models-table
.
  • Demo for
    ember-bootstrap
    with Bootstrap v3 - demo bs3. Theme
    ember-bootstrap-v3
    is used here. Add file
    app/instance-initializers/emt-inject.js
    to your project and table components will use this theme automatically:
export function initialize(appInstance) {
  appInstance.inject('component:models-table', 'themeInstance', `theme:ember-bootstrap-v3`);
  appInstance.inject('component:models-table-server-paginated', 'themeInstance', `theme:ember-bootstrap-v3`);
}

export default { name: 'emt-inject', initialize };

  • Demo for
    ember-bootstrap
    with Bootstrap v4 - demo bs4. Theme
    ember-bootstrap-v4
    is used here. Add file
    app/instance-initializers/emt-inject.js
    to your project and table components will use this theme automatically:
export function initialize(appInstance) {
  appInstance.inject('component:models-table', 'themeInstance', `theme:ember-bootstrap-v4`);
  appInstance.inject('component:models-table-server-paginated', 'themeInstance', `theme:ember-bootstrap-v4`);
}

export default { name: 'emt-inject', initialize };

  • Demo for
    ember-paper
    - demo paper. Theme
    ember-paper
    is used here. Add file
    app/instance-initializers/emt-inject.js
    to your project and table components will use this theme automatically:
export function initialize(appInstance) {
  appInstance.inject('component:models-table', 'themeInstance', `theme:ember-paper`);
  appInstance.inject('component:models-table-server-paginated', 'themeInstance', `theme:ember-paper`);
}

export default { name: 'emt-inject', initialize };

IMPORTANT Custom styles for

ember-paper
theme are not included to the
ember-models-table
by default. You can copy it from
dummy
app or create your own styles.
  • Demo for
    plain-html
    - demo plain html. Theme
    plain-html
    is used here. Add file
    app/instance-initializers/emt-inject.js
    to your project and table components will use this theme automatically:
export function initialize(appInstance) {
  appInstance.inject('component:models-table', 'themeInstance', `theme:plain-html`);
  appInstance.inject('component:models-table-server-paginated', 'themeInstance', `theme:plain-html`);
}

export default { name: 'emt-inject', initialize };

IMPORTANT Custom styles for

plain-html
theme are not included to the
ember-models-table
by default. You can copy it from
dummy
app or create your own styles.

Custom themes

To use your custom theme based on

DefaultTheme
or its children you must do next steps:
  • Register your theme in the application initializer:
// app/initializes/emt-my-super-theme.js
import MySuperTheme from 'your/custom/path';

export function initialize(application) { application.register('emt-theme:my-super-theme', MySuperTheme, {singleton: false}); }

export default { name: 'emt-my-custom-theme', after: 'emt-themes', initialize };

  • Inject your theme to the component in the application instance initializer:
// app/instance-initializers/emt-my-super-theme.js
export function initialize(appInstance) {
  appInstance.inject('component:models-table', 'themeInstance', 'theme:my-super-theme');
  appInstance.inject('component:models-table-server-paginated', 'themeInstance', 'theme:my-super-theme');
}

export default { name: 'emt-my-super-theme-inject', after: 'emt-inject', initialize };

DefaultTheme
uses
owner.lookup
internally. That is why themes based on it must be registered and injected and not just passed as arguments to the
models-table
component.

Old versions

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.