Skip to content

Commit a78864d

Browse files
author
sgotre
committed
Adding support for Light Column Filter
1 parent bc53c96 commit a78864d

24 files changed

+789
-99
lines changed

‎bower.json

+58-56
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,60 @@
11
{
2-
"name": "angular-datatables",
3-
"version": "0.5.0",
4-
"author": "l-lin",
5-
"license": "MIT",
6-
"main": [
7-
"dist/angular-datatables.js",
8-
"dist/plugins/bootstrap/angular-datatables.bootstrap.js",
9-
"dist/plugins/bootstrap/datatables.bootstrap.css",
10-
"dist/plugins/colreorder/angular-datatables.colreorder.js",
11-
"dist/plugins/columnfilter/angular-datatables.columnfilter.js",
12-
"dist/plugins/colvis/angular-datatables.colvis.js",
13-
"dist/plugins/fixedcolumns/angular-datatables.fixedcolumns.js",
14-
"dist/plugins/fixedheader/angular-datatables.fixedheader.js",
15-
"dist/plugins/scroller/angular-datatables.scroller.js",
16-
"dist/plugins/tabletools/angular-datatables.tabletools.js"
17-
],
18-
"ignore": [
19-
".bowerrc",
20-
".editorconfig",
21-
".git*",
22-
".jshintrc",
23-
".esformatter",
24-
"Gruntfile.js",
25-
"test",
26-
"node_modules",
27-
"src",
28-
".travis.yml",
29-
"vendor",
30-
"data.json",
31-
"data1.json",
32-
"demo",
33-
"favicon.png",
34-
"index.html",
35-
"README.md",
36-
"CONTRIBUTING.md",
37-
"server.js",
38-
"styles",
39-
"_config.yml",
40-
"grunt",
41-
"images",
42-
"package.json",
43-
"archives",
44-
"archives.json",
45-
"dtOptions.json",
46-
"dtColumns.json"
47-
],
48-
"dependencies": {
49-
"angular": ">=1.3.0",
50-
"jquery": ">=1.11.0",
51-
"datatables": ">=1.10.0"
52-
},
53-
"devDependencies": {
54-
"angular-mocks": ">=1.3.0",
55-
"bootstrap": ">=3.0.1",
56-
"angular-bootstrap": ">=0.10.0"
57-
}
2+
"name": "angular-datatables",
3+
"version": "0.5.0",
4+
"author": "l-lin",
5+
"license": "MIT",
6+
"main": [
7+
"dist/angular-datatables.js",
8+
"dist/plugins/bootstrap/angular-datatables.bootstrap.js",
9+
"dist/plugins/bootstrap/datatables.bootstrap.css",
10+
"dist/plugins/colreorder/angular-datatables.colreorder.js",
11+
"dist/plugins/columnfilter/angular-datatables.columnfilter.js",
12+
"dist/plugins/light-columnfilter/angular-datatables.light-columnfilter.js",
13+
"dist/plugins/colvis/angular-datatables.colvis.js",
14+
"dist/plugins/fixedcolumns/angular-datatables.fixedcolumns.js",
15+
"dist/plugins/fixedheader/angular-datatables.fixedheader.js",
16+
"dist/plugins/scroller/angular-datatables.scroller.js",
17+
"dist/plugins/tabletools/angular-datatables.tabletools.js"
18+
],
19+
"ignore": [
20+
".bowerrc",
21+
".editorconfig",
22+
".git*",
23+
".jshintrc",
24+
".esformatter",
25+
"Gruntfile.js",
26+
"test",
27+
"node_modules",
28+
"src",
29+
".travis.yml",
30+
"vendor",
31+
"data.json",
32+
"data1.json",
33+
"demo",
34+
"favicon.png",
35+
"index.html",
36+
"README.md",
37+
"CONTRIBUTING.md",
38+
"server.js",
39+
"styles",
40+
"_config.yml",
41+
"grunt",
42+
"images",
43+
"package.json",
44+
"archives",
45+
"archives.json",
46+
"dtOptions.json",
47+
"dtColumns.json"
48+
],
49+
"dependencies": {
50+
"angular": ">=1.3.0",
51+
"datatables": ">=1.10.0",
52+
"datatables-light-columnfilter": "~0.0.7",
53+
"jquery": ">=1.11.0"
54+
},
55+
"devDependencies": {
56+
"angular-mocks": ">=1.3.0",
57+
"bootstrap": ">=3.0.1",
58+
"angular-bootstrap": ">=0.10.0"
59+
}
5860
}

‎demo/app.js

+1
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ angular.module('showcase', [
2424
'showcase.withAngularTranslate',
2525
'showcase.withColReorder',
2626
'showcase.withColumnFilter',
27+
'showcase.withLightColumnFilter',
2728
'showcase.withColVis',
2829
'showcase.withResponsive',
2930
'showcase.withScroller',

‎demo/partials/gettingStarted.html

+1
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ <h3>Dependencies</h3>
2121
<li><a href="https://datatables.net/extras/colvis/">ColVis</a> with version 1.1.0+</li>
2222
<li><a href="https://datatables.net/extras/tabletools/">TableTools</a> with version 2.2.0+</li>
2323
<li><a href="http://jquery-datatables-column-filter.googlecode.com/svn/trunk/index.html">ColumnFilter</a> with version 1.5.6</li>
24+
<li><a href="https://github.com/thansen-solire/datatables-light-columnfilter/">LightColumnFilter</a> with version 0.0.7</li>
2425
<li><a href="https://datatables.net/extensions/fixedcolumns/">FixedColumns</a> with version 3.0.2</li>
2526
<li><a href="https://datatables.net/extensions/fixedheader/">FixedHeader</a> with version 2.1.2</li>
2627
<li><a href="https://datatables.net/extensions/responsive/">Responsive</a> with version 1.0.1</li>

‎demo/usages.js

+3
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,9 @@ angular.module('showcase.usages', ['ngResource'])
8181
}, {
8282
name: 'withColumnFilter',
8383
label: 'With Column Filter'
84+
}, {
85+
name: 'withLightColumnFilter',
86+
label: 'With Light Column Filter'
8487
},{
8588
name: 'bootstrapIntegration',
8689
label: 'Bootstrap integration'

‎demo/withPlugins/withLightColumnFilter.html

+84
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
<article class="main-content">
2+
<header class="article-header">
3+
<h1><i class="fa fa-play"></i>&nbsp;With the <a href="https://github.com/thansen-solire/datatables-light-columnfilter"> DataTables Light Column Filter</a></h1>
4+
</header>
5+
<section class="article-content">
6+
<p>
7+
The <code>angular-datatables</code> also provides an API in order to make the plugin <code>Light Column Filter</code> work with datatables.
8+
</p>
9+
<p>
10+
You need to add the file <code>angular-datatables.light-columnfilter.min.js</code> to your HTML file.
11+
</p>
12+
<p class="alert alert-warning">
13+
<i class="fa fa-warning"></i> The Light Column Filter only works with serverside processing! <br>
14+
</p>
15+
<p class="alert alert-warning">
16+
<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>
17+
</p>
18+
<p>
19+
You also need to add the dependency <code>datatables.light-columnfilter</code> to your Angular app.
20+
</p>
21+
<p>
22+
See the <a ui-sref="api">API</a> for the complete list of methods of the helper.
23+
</p>
24+
</section>
25+
<section class="showcase">
26+
<tabset>
27+
<tab heading="Preview">
28+
<article class="preview">
29+
<div ng-controller="WithLightColumnFilterCtrl as showCase">
30+
<table datatable dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" class="row-border hover">
31+
<tfoot>
32+
<tr>
33+
<th>ID
34+
<th>First Name
35+
<th>Last Name
36+
</tr>
37+
</tfoot>
38+
</table>
39+
</div>
40+
</article>
41+
</tab>
42+
<tab heading="HTML">
43+
<div hljs>
44+
<div ng-controller="WithLightColumnFilterCtrl as showCase">
45+
<table datatable dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" class="row-border hover">
46+
<tfoot>
47+
<tr>
48+
<th>ID
49+
<th>First Name
50+
<th>Last Name
51+
</tr>
52+
</tfoot>
53+
</table>
54+
</div>
55+
<!-- ... -->
56+
<script src="vendor/datatables-light-columnfilter/dist/dataTables.lightColumnFilter.min.js"></script>
57+
<script src="vendor/angular-datatables/dist/plugins/light-columnfilter/angular-datatables.light-columnfilter.min.js"></script>
58+
</div>
59+
</tab>
60+
<tab heading="JS">
61+
<div hljs language="js">
62+
angular.module('showcase.withLightColumnFilter', ['datatables', 'datatables.light-columnfilter'])
63+
.controller('WithLightColumnFilterCtrl', WithLightColumnFilterCtrl);
64+
65+
function WithColumnFilterCtrl(DTOptionsBuilder, DTColumnBuilder) {
66+
var vm = this;
67+
vm.dtOptions = DTOptionsBuilder.fromSource('data.json')
68+
.withPaginationType('full_numbers')
69+
.withLightColumnFilter({
70+
0 : { "type" : "text"},
71+
1 : { "type" : "text"},
72+
2 : { "type" : "text"}
73+
});
74+
vm.dtColumns = [
75+
DTColumnBuilder.newColumn('id').withTitle('ID'),
76+
DTColumnBuilder.newColumn('firstName').withTitle('First name'),
77+
DTColumnBuilder.newColumn('lastName').withTitle('Last name')
78+
];
79+
}
80+
</div>
81+
</tab>
82+
</tabset>
83+
</section>
84+
</article>

‎demo/withPlugins/withLightColumnFilter.js

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
'use strict';
2+
angular.module('showcase.withLightColumnFilter', ['datatables', 'datatables.light-columnfilter'])
3+
.controller('WithLightColumnFilterCtrl', WithLightColumnFilterCtrl);
4+
5+
function WithLightColumnFilterCtrl(DTOptionsBuilder, DTColumnBuilder) {
6+
var vm = this;
7+
vm.dtOptions = DTOptionsBuilder.fromSource('data.json')
8+
.withPaginationType('full_numbers')
9+
.withLightColumnFilter({
10+
0 : { "type" : "text"},
11+
1 : { "type" : "text"},
12+
2 : { "type" : "text"}
13+
});
14+
vm.dtColumns = [
15+
DTColumnBuilder.newColumn('id').withTitle('ID'),
16+
DTColumnBuilder.newColumn('firstName').withTitle('First name'),
17+
DTColumnBuilder.newColumn('lastName').withTitle('Last name')
18+
];
19+
}

‎dist/angular-datatables.js

+13-13
Original file line numberDiff line numberDiff line change
@@ -1098,21 +1098,21 @@ function dtAjaxRenderer($q, $timeout, DTRenderer, DTRendererService, DT_DEFAULT_
10981098
}
10991099

11001100
function _doRender(options, $elem) {
1101-
var defer = $q.defer();
1102-
// Set it to true in order to be able to redraw the dataTable
1103-
options.bDestroy = true;
1104-
DTRendererService.hideLoading($elem);
1105-
// Condition to refresh the dataTable
1106-
if (_shouldDeferRender(options)) {
1107-
$timeout(function() {
1108-
defer.resolve(DTRendererService.renderDataTable($elem, options));
1109-
}, 0, false);
1110-
} else {
1101+
var defer = $q.defer();
1102+
// Set it to true in order to be able to redraw the dataTable
1103+
options.bDestroy = true;
1104+
DTRendererService.hideLoading($elem);
1105+
// Condition to refresh the dataTable
1106+
if (_shouldDeferRender(options)) {
1107+
$timeout(function() {
11111108
defer.resolve(DTRendererService.renderDataTable($elem, options));
1112-
}
1113-
return defer.promise;
1109+
}, 0, false);
1110+
} else {
1111+
defer.resolve(DTRendererService.renderDataTable($elem, options));
11141112
}
1115-
// See https://github.com/l-lin/angular-datatables/issues/147
1113+
return defer.promise;
1114+
}
1115+
// See https://github.com/l-lin/angular-datatables/issues/147
11161116
function _shouldDeferRender(options) {
11171117
if (angular.isDefined(options) && angular.isDefined(options.dom)) {
11181118
// S for scroller plugin

0 commit comments

Comments
 (0)