Skip to content

Commit 83c239b

Browse files
committed
Refactoring demo
1 parent cc94151 commit 83c239b

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

75 files changed

+597
-826
lines changed

archives/v0.1.1/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
<header class="header">
3535
<div class="container">
3636
<h1>
37-
<a href="/">angular-datatables</a>
37+
<a href="/">angular-datatables v0.1.1</a>
3838
<span class="header-icon hidden-xs hidden-sm">
3939
<a href="https://github.com/l-lin/angular-datatables/archive/v0.1.1.zip"><i class="fa fa-download"></i></a>
4040
</span>

archives/v0.2.0/favicon.png

-6.75 KB
Binary file not shown.

archives/v0.2.0/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
<header class="header">
3535
<div class="container">
3636
<h1>
37-
<a href="/">angular-datatables</a>
37+
<a href="/">angular-datatables v0.2.0</a>
3838
<span class="header-icon hidden-xs hidden-sm">
3939
<a href="https://github.com/l-lin/angular-datatables/archive/v0.2.0.zip"><i class="fa fa-download"></i></a>
4040
</span>

demo/advanced/angularWayDataChange.js

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
'use strict';
2+
angular.module('datatablesSampleApp').controller('angularWayChangeDataCtrl', function ($scope, $resource, DTOptionsBuilder, DTColumnDefBuilder) {
3+
var _buildPerson2Add = function (id) {
4+
return {
5+
id: id,
6+
firstName: 'Foo' + id,
7+
lastName: 'Bar' + id
8+
};
9+
};
10+
11+
$scope.persons = $resource('data1.json').query();
12+
$scope.dtOptions = DTOptionsBuilder.newOptions().withPaginationType('full_numbers');
13+
$scope.dtColumnDefs = [
14+
DTColumnDefBuilder.newColumnDef(0),
15+
DTColumnDefBuilder.newColumnDef(1),
16+
DTColumnDefBuilder.newColumnDef(2),
17+
DTColumnDefBuilder.newColumnDef(3).notSortable()
18+
];
19+
20+
$scope.person2Add = _buildPerson2Add(1);
21+
$scope.addPerson = function () {
22+
$scope.persons.push(angular.copy($scope.person2Add));
23+
$scope.person2Add = _buildPerson2Add($scope.person2Add.id + 1);
24+
};
25+
26+
$scope.modifyPerson = function (index) {
27+
$scope.persons.splice(index, 1, angular.copy($scope.person2Add))
28+
$scope.person2Add = _buildPerson2Add($scope.person2Add.id + 1);
29+
};
30+
31+
$scope.removePerson = function (index) {
32+
$scope.persons.splice(index, 1);
33+
};
34+
});

demo/advanced/bindAngularDirective.js

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
'use strict';
2+
angular.module('datatablesSampleApp').controller('bindAngularDirectiveCtrl', function ($scope, $compile, DTOptionsBuilder, DTColumnBuilder) {
3+
$scope.message = '';
4+
$scope.edit = function(id) {
5+
$scope.message = 'You are trying to edit the row with ID: ' + id;
6+
// Edit some data and call server to make changes...
7+
// Then reload the data so that DT is refreshed
8+
$scope.dtOptions.reloadData();
9+
};
10+
$scope.delete = function(id) {
11+
$scope.message = 'You are trying to remove the row with ID: ' + id;
12+
// Delete some data and call server to make changes...
13+
// Then reload the data so that DT is refreshed
14+
$scope.dtOptions.reloadData();
15+
};
16+
17+
$scope.dtOptions = DTOptionsBuilder.fromSource('data1.json')
18+
.withPaginationType('full_numbers')
19+
.withOption('createdRow', function(row, data, dataIndex) {
20+
// Recompiling so we can bind Angular directive to the DT
21+
$compile(angular.element(row).contents())($scope);
22+
});
23+
$scope.dtColumns = [
24+
DTColumnBuilder.newColumn('id').withTitle('ID'),
25+
DTColumnBuilder.newColumn('firstName').withTitle('First name'),
26+
DTColumnBuilder.newColumn('lastName').withTitle('Last name'),
27+
DTColumnBuilder.newColumn(null).withTitle('Actions').notSortable()
28+
.renderWith(function(data, type, full, meta) {
29+
return '<button class="btn btn-warning" ng-click="edit(' + data.id + ')">' +
30+
' <i class="fa fa-edit"></i>' +
31+
'</button>&nbsp;' +
32+
'<button class="btn btn-danger" ng-click="delete(' + data.id + ')">' +
33+
' <i class="fa fa-trash-o"></i>' +
34+
'</button>';
35+
})
36+
];
37+
});
File renamed without changes.

demo/advanced/changeOptions.js

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
'use strict';
2+
angular.module('datatablesSampleApp').controller('changeOptionsCtrl', function ($scope, DTOptionsBuilder, DTColumnDefBuilder) {
3+
$scope.dtOptions = DTOptionsBuilder.newOptions();
4+
$scope.dtColumnDefs = [
5+
DTColumnDefBuilder.newColumnDef(0),
6+
DTColumnDefBuilder.newColumnDef(1).notVisible(),
7+
DTColumnDefBuilder.newColumnDef(2).notSortable()
8+
];
9+
10+
$scope.changeOptions = function() {
11+
$scope.dtOptions = DTOptionsBuilder.newOptions()
12+
.withPaginationType('full_numbers')
13+
.withDisplayLength(2)
14+
.withDOM('pitrfl');
15+
};
16+
$scope.changeColumnDefs = function() {
17+
$scope.dtColumnDefs = [
18+
DTColumnDefBuilder.newColumnDef(0).notVisible(),
19+
DTColumnDefBuilder.newColumnDef(1).notVisible(),
20+
DTColumnDefBuilder.newColumnDef(2).notSortable()
21+
];
22+
};
23+
});

demo/advanced/dataReloadWithAjax.js

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
'use strict';
2+
angular.module('datatablesSampleApp').controller('dataReloadWithAjaxCtrl', function($scope, DTOptionsBuilder, DTColumnBuilder) {
3+
$scope.reloadData = function() {
4+
$scope.dtOptions.reloadData();
5+
};
6+
$scope.changeData = function() {
7+
$scope.dtOptions.sAjaxSource = 'data1.json';
8+
};
9+
10+
$scope.dtOptions = DTOptionsBuilder.fromSource('data.json').withPaginationType('full_numbers');
11+
12+
$scope.dtColumns = [
13+
DTColumnBuilder.newColumn('id').withTitle('ID'),
14+
DTColumnBuilder.newColumn('firstName').withTitle('First name'),
15+
DTColumnBuilder.newColumn('lastName').withTitle('Last name').notVisible()
16+
];
17+
});
+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
'use strict';
2+
angular.module('datatablesSampleApp').controller('dataReloadWithPromiseCtrl', function($scope, DTOptionsBuilder, DTColumnBuilder, $resource) {
3+
$scope.reloadData = function() {
4+
$scope.dtOptions.reloadData();
5+
};
6+
$scope.changeData = function() {
7+
$scope.dtOptions.fnPromise = function() {
8+
return $resource('data1.json').query().$promise;
9+
};
10+
// Or $scope.dtOptions.fnPromise = $resource('data1.json').query().$promise;
11+
};
12+
13+
$scope.dtOptions = DTOptionsBuilder.fromFnPromise(function() {
14+
return $resource('data.json').query().$promise;
15+
}).withPaginationType('full_numbers');
16+
17+
$scope.dtColumns = [
18+
DTColumnBuilder.newColumn('id').withTitle('ID'),
19+
DTColumnBuilder.newColumn('firstName').withTitle('First name'),
20+
DTColumnBuilder.newColumn('lastName').withTitle('Last name').notVisible()
21+
];
22+
});
File renamed without changes.

demo/advanced/rowClickEvent.js

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
'use strict';
2+
angular.module('datatablesSampleApp').controller('rowClickEventCtrl', function ($scope, DTOptionsBuilder, DTColumnBuilder) {
3+
$scope.message = '';
4+
$scope.someClickHandler = function(info) {
5+
$scope.message = info.id + ' - ' + info.firstName;
6+
};
7+
8+
$scope.dtOptions = DTOptionsBuilder.fromSource('data.json')
9+
.withPaginationType('full_numbers')
10+
.withOption('rowCallback', function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
11+
// Unbind first in order to avoid any duplicate handler (see https://github.com/l-lin/angular-datatables/issues/87)
12+
$('td', nRow).unbind('click');
13+
$('td', nRow).bind('click', function() {
14+
$scope.$apply(function() {
15+
$scope.someClickHandler(aData);
16+
});
17+
});
18+
return nRow;
19+
});
20+
$scope.dtColumns = [
21+
DTColumnBuilder.newColumn('id').withTitle('ID'),
22+
DTColumnBuilder.newColumn('firstName').withTitle('First name'),
23+
DTColumnBuilder.newColumn('lastName').withTitle('Last name').notVisible()
24+
];
25+
});

demo/advanced/serverSideProcessing.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
'use strict';
2+
angular.module('datatablesSampleApp').controller('serverSideProcessingCtrl', function ($scope, DTOptionsBuilder, DTColumnBuilder) {
3+
$scope.dtOptions = DTOptionsBuilder.fromSource('data.json')
4+
.withPaginationType('full_numbers');
5+
// $scope.dtOptions = DTOptionsBuilder.newOptions()
6+
// .withOption('ajax', {
7+
// // Either you specify the AjaxDataProp here
8+
// // dataSrc: 'data',
9+
// url: 'data/serverSideProcessing',
10+
// type: 'POST'
11+
// })
12+
// // or here
13+
// .withDataProp('data')
14+
// .withOption('serverSide', true)
15+
// .withPaginationType('full_numbers');
16+
$scope.dtColumns = [
17+
DTColumnBuilder.newColumn('id').withTitle('ID'),
18+
DTColumnBuilder.newColumn('firstName').withTitle('First name'),
19+
DTColumnBuilder.newColumn('lastName').withTitle('Last name').notVisible()
20+
];
21+
});

demo/angularWay.js

-10
This file was deleted.

demo/angularWayDataChange.js

-40
This file was deleted.

demo/angularWayWithOptions.js

-16
This file was deleted.

demo/api.js

-15
This file was deleted.

demo/partials/api.html renamed to demo/api/api.html

+4-4
Original file line numberDiff line numberDiff line change
@@ -10,16 +10,16 @@ <h1><i class="fa fa-code"></i>&nbsp;API</h1>
1010
<section ng-controller="apiCtrl" class="showcase">
1111
<tabset>
1212
<tab heading="DTDefaultOptions">
13-
<article ng-include="'demo/partials/api_default_options.html'"></article>
13+
<article ng-include="'demo/api/apiDefaultOptions.html'"></article>
1414
</tab>
1515
<tab heading="DTOptionsBuilder">
16-
<article ng-include="'demo/partials/api_options_builder.html'"></article>
16+
<article ng-include="'demo/api/apiOptionsBuilder.html'"></article>
1717
</tab>
1818
<tab heading="DTColumnBuilder">
19-
<article ng-include="'demo/partials/api_column_builder.html'"></article>
19+
<article ng-include="'demo/api/apiColumnBuilder.html'"></article>
2020
</tab>
2121
<tab heading="DTColumnDefBuilder">
22-
<article ng-include="'demo/partials/api_column_def_builder.html'"></article>
22+
<article ng-include="'demo/api/apiColumnDefBuilder.html'"></article>
2323
</tab>
2424
</tabset>
2525
</section>

demo/api/api.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
'use strict';
2+
angular.module('datatablesSampleApp').controller('apiCtrl', function($scope, DTOptionsBuilder) {
3+
$scope.dtOptions = DTOptionsBuilder.newOptions()
4+
.withDisplayLength(10)
5+
.withColReorder()
6+
.withColVis()
7+
.withOption('bAutoWidth', false)
8+
.withTableTools('vendor/datatables-tabletools/swf/copy_csv_xls_pdf.swf');
9+
});

0 commit comments

Comments
 (0)