This repository has been archived by the owner on Feb 2, 2025. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 489
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
19 changed files
with
715 additions
and
56 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,58 +1,60 @@ | ||
| { | ||
| "name": "angular-datatables", | ||
| "version": "0.5.0", | ||
| "author": "l-lin", | ||
| "license": "MIT", | ||
| "main": [ | ||
| "dist/angular-datatables.js", | ||
| "dist/plugins/bootstrap/angular-datatables.bootstrap.js", | ||
| "dist/plugins/bootstrap/datatables.bootstrap.css", | ||
| "dist/plugins/colreorder/angular-datatables.colreorder.js", | ||
| "dist/plugins/columnfilter/angular-datatables.columnfilter.js", | ||
| "dist/plugins/colvis/angular-datatables.colvis.js", | ||
| "dist/plugins/fixedcolumns/angular-datatables.fixedcolumns.js", | ||
| "dist/plugins/fixedheader/angular-datatables.fixedheader.js", | ||
| "dist/plugins/scroller/angular-datatables.scroller.js", | ||
| "dist/plugins/tabletools/angular-datatables.tabletools.js" | ||
| ], | ||
| "ignore": [ | ||
| ".bowerrc", | ||
| ".editorconfig", | ||
| ".git*", | ||
| ".jshintrc", | ||
| ".esformatter", | ||
| "Gruntfile.js", | ||
| "test", | ||
| "node_modules", | ||
| "src", | ||
| ".travis.yml", | ||
| "vendor", | ||
| "data.json", | ||
| "data1.json", | ||
| "demo", | ||
| "favicon.png", | ||
| "index.html", | ||
| "README.md", | ||
| "CONTRIBUTING.md", | ||
| "server.js", | ||
| "styles", | ||
| "_config.yml", | ||
| "grunt", | ||
| "images", | ||
| "package.json", | ||
| "archives", | ||
| "archives.json", | ||
| "dtOptions.json", | ||
| "dtColumns.json" | ||
| ], | ||
| "dependencies": { | ||
| "angular": ">=1.3.0", | ||
| "jquery": ">=1.11.0", | ||
| "datatables": ">=1.10.0" | ||
| }, | ||
| "devDependencies": { | ||
| "angular-mocks": ">=1.3.0", | ||
| "bootstrap": ">=3.0.1", | ||
| "angular-bootstrap": ">=0.10.0" | ||
| } | ||
| "name": "angular-datatables", | ||
| "version": "0.5.0", | ||
| "author": "l-lin", | ||
| "license": "MIT", | ||
| "main": [ | ||
| "dist/angular-datatables.js", | ||
| "dist/plugins/bootstrap/angular-datatables.bootstrap.js", | ||
| "dist/plugins/bootstrap/datatables.bootstrap.css", | ||
| "dist/plugins/colreorder/angular-datatables.colreorder.js", | ||
| "dist/plugins/columnfilter/angular-datatables.columnfilter.js", | ||
| "dist/plugins/light-columnfilter/angular-datatables.light-columnfilter.js", | ||
| "dist/plugins/colvis/angular-datatables.colvis.js", | ||
| "dist/plugins/fixedcolumns/angular-datatables.fixedcolumns.js", | ||
| "dist/plugins/fixedheader/angular-datatables.fixedheader.js", | ||
| "dist/plugins/scroller/angular-datatables.scroller.js", | ||
| "dist/plugins/tabletools/angular-datatables.tabletools.js" | ||
| ], | ||
| "ignore": [ | ||
| ".bowerrc", | ||
| ".editorconfig", | ||
| ".git*", | ||
| ".jshintrc", | ||
| ".esformatter", | ||
| "Gruntfile.js", | ||
| "test", | ||
| "node_modules", | ||
| "src", | ||
| ".travis.yml", | ||
| "vendor", | ||
| "data.json", | ||
| "data1.json", | ||
| "demo", | ||
| "favicon.png", | ||
| "index.html", | ||
| "README.md", | ||
| "CONTRIBUTING.md", | ||
| "server.js", | ||
| "styles", | ||
| "_config.yml", | ||
| "grunt", | ||
| "images", | ||
| "package.json", | ||
| "archives", | ||
| "archives.json", | ||
| "dtOptions.json", | ||
| "dtColumns.json" | ||
| ], | ||
| "dependencies": { | ||
| "angular": ">=1.3.0", | ||
| "datatables": ">=1.10.0", | ||
| "datatables-light-columnfilter": "~0.0.7", | ||
| "jquery": ">=1.11.0" | ||
| }, | ||
| "devDependencies": { | ||
| "angular-mocks": ">=1.3.0", | ||
| "bootstrap": ">=3.0.1", | ||
| "angular-bootstrap": ">=0.10.0" | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,84 @@ | ||
| <article class="main-content"> | ||
| <header class="article-header"> | ||
| <h1><i class="fa fa-play"></i> With the <a href="https://github.com/thansen-solire/datatables-light-columnfilter"> DataTables Light Column Filter</a></h1> | ||
| </header> | ||
| <section class="article-content"> | ||
| <p> | ||
| The <code>angular-datatables</code> also provides an API in order to make the plugin <code>Light Column Filter</code> work with datatables. | ||
| </p> | ||
| <p> | ||
| You need to add the file <code>angular-datatables.light-columnfilter.min.js</code> to your HTML file. | ||
| </p> | ||
| <p class="alert alert-warning"> | ||
| <i class="fa fa-warning"></i> The Light Column Filter only works with serverside processing! <br> | ||
| </p> | ||
| <p class="alert alert-warning"> | ||
| <i class="fa fa-warning"></i> The Light Column Filter does not work with <code>Responsive</code>. Do not use with normal <code>Column Filter</code> | ||
| </p> | ||
| <p> | ||
| You also need to add the dependency <code>datatables.light-columnfilter</code> to your Angular app. | ||
| </p> | ||
| <p> | ||
| See the <a ui-sref="api">API</a> for the complete list of methods of the helper. | ||
| </p> | ||
| </section> | ||
| <section class="showcase"> | ||
| <tabset> | ||
| <tab heading="Preview"> | ||
| <article class="preview"> | ||
| <div ng-controller="WithLightColumnFilterCtrl as showCase"> | ||
| <table datatable dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" class="row-border hover"> | ||
| <tfoot> | ||
| <tr> | ||
| <th>ID | ||
| <th>First Name | ||
| <th>Last Name | ||
| </tr> | ||
| </tfoot> | ||
| </table> | ||
| </div> | ||
| </article> | ||
| </tab> | ||
| <tab heading="HTML"> | ||
| <div hljs> | ||
| <div ng-controller="WithLightColumnFilterCtrl as showCase"> | ||
| <table datatable dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" class="row-border hover"> | ||
| <tfoot> | ||
| <tr> | ||
| <th>ID | ||
| <th>First Name | ||
| <th>Last Name | ||
| </tr> | ||
| </tfoot> | ||
| </table> | ||
| </div> | ||
| <!-- ... --> | ||
| <script src="vendor/datatables-light-columnfilter/dist/dataTables.lightColumnFilter.min.js"></script> | ||
| <script src="vendor/angular-datatables/dist/plugins/light-columnfilter/angular-datatables.light-columnfilter.min.js"></script> | ||
| </div> | ||
| </tab> | ||
| <tab heading="JS"> | ||
| <div hljs language="js"> | ||
| angular.module('showcase.withLightColumnFilter', ['datatables', 'datatables.light-columnfilter']) | ||
| .controller('WithLightColumnFilterCtrl', WithLightColumnFilterCtrl); | ||
|
|
||
| function WithColumnFilterCtrl(DTOptionsBuilder, DTColumnBuilder) { | ||
| var vm = this; | ||
| vm.dtOptions = DTOptionsBuilder.fromSource('data.json') | ||
| .withPaginationType('full_numbers') | ||
| .withLightColumnFilter({ | ||
| 0 : { "type" : "text"}, | ||
| 1 : { "type" : "text"}, | ||
| 2 : { "type" : "text"} | ||
| }); | ||
| vm.dtColumns = [ | ||
| DTColumnBuilder.newColumn('id').withTitle('ID'), | ||
| DTColumnBuilder.newColumn('firstName').withTitle('First name'), | ||
| DTColumnBuilder.newColumn('lastName').withTitle('Last name') | ||
| ]; | ||
| } | ||
| </div> | ||
| </tab> | ||
| </tabset> | ||
| </section> | ||
| </article> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| 'use strict'; | ||
| angular.module('showcase.withLightColumnFilter', ['datatables', 'datatables.light-columnfilter']) | ||
| .controller('WithLightColumnFilterCtrl', WithLightColumnFilterCtrl); | ||
|
|
||
| function WithLightColumnFilterCtrl(DTOptionsBuilder, DTColumnBuilder) { | ||
| var vm = this; | ||
| vm.dtOptions = DTOptionsBuilder.fromSource('data.json') | ||
| .withPaginationType('full_numbers') | ||
| .withLightColumnFilter({ | ||
| 0 : { "type" : "text"}, | ||
| 1 : { "type" : "text"}, | ||
| 2 : { "type" : "text"} | ||
| }); | ||
| vm.dtColumns = [ | ||
| DTColumnBuilder.newColumn('id').withTitle('ID'), | ||
| DTColumnBuilder.newColumn('firstName').withTitle('First name'), | ||
| DTColumnBuilder.newColumn('lastName').withTitle('Last name') | ||
| ]; | ||
| } |
75 changes: 75 additions & 0 deletions
75
dist/plugins/light-columnfilter/angular-datatables.light-columnfilter.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,75 @@ | ||
| /*! | ||
| * angular-datatables - v0.5.0 | ||
| * https://github.com/l-lin/angular-datatables | ||
| * License: MIT | ||
| */ | ||
| (function (window, document, $, angular) { | ||
|
|
||
| 'use strict'; | ||
|
|
||
| // See https://github.com/thansen-solire/datatables-light-columnfilter | ||
| angular.module('datatables.light-columnfilter', ['datatables']) | ||
| .config(dtLightColumnFilterConfig) | ||
| .run(initLightColumnFilterPlugin); | ||
|
|
||
| /* @ngInject */ | ||
| function dtLightColumnFilterConfig($provide) { | ||
| $provide.decorator('DTOptionsBuilder', dtOptionsBuilderDecorator); | ||
|
|
||
| function dtOptionsBuilderDecorator($delegate) { | ||
| var newOptions = $delegate.newOptions; | ||
| var fromSource = $delegate.fromSource; | ||
| var fromFnPromise = $delegate.fromFnPromise; | ||
|
|
||
| $delegate.newOptions = function() { | ||
| return _decorateOptions(newOptions); | ||
| }; | ||
| $delegate.fromSource = function(ajax) { | ||
| return _decorateOptions(fromSource, ajax); | ||
| }; | ||
| $delegate.fromFnPromise = function(fnPromise) { | ||
| return _decorateOptions(fromFnPromise, fnPromise); | ||
| }; | ||
|
|
||
| return $delegate; | ||
|
|
||
| function _decorateOptions(fn, params) { | ||
| var options = fn(params); | ||
| options.withLightColumnFilter = withLightColumnFilter; | ||
| return options; | ||
|
|
||
| /** | ||
| * Add column filter support | ||
| * @param lightColumnFilterOptions the plugins options | ||
| * @returns {DTOptions} the options | ||
| */ | ||
| function withLightColumnFilter(lightColumnFilterOptions) { | ||
| options.hasLightColumnFilter = true; | ||
| if (lightColumnFilterOptions) { | ||
| options.lightColumnFilterOptions = lightColumnFilterOptions; | ||
| } | ||
| return options; | ||
| } | ||
| } | ||
| } | ||
| dtOptionsBuilderDecorator.$inject = ['$delegate']; | ||
| } | ||
| dtLightColumnFilterConfig.$inject = ['$provide']; | ||
|
|
||
| /* @ngInject */ | ||
| function initLightColumnFilterPlugin(DTRendererService) { | ||
| var lightColumnFilterPlugin = { | ||
| postRender: postRender | ||
| }; | ||
| DTRendererService.registerPlugin(lightColumnFilterPlugin); | ||
|
|
||
| function postRender(options, result) { | ||
| if (options && options.hasLightColumnFilter) { | ||
| new $.fn.dataTable.ColumnFilter(result.DataTable, options.lightColumnFilterOptions); | ||
| } | ||
| } | ||
| } | ||
| initLightColumnFilterPlugin.$inject = ['DTRendererService']; | ||
|
|
||
|
|
||
| })(window, document, jQuery, angular); |
6 changes: 6 additions & 0 deletions
6
dist/plugins/light-columnfilter/angular-datatables.light-columnfilter.min.js
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.