Skip to content
This repository was archived by the owner on Feb 2, 2025. It is now read-only.

Commit 72f3382

Browse files
l-linl-lin
committed
TypeError: Cannot read property 'parentNode' of null on Angular way #181 
1 parent 33e3648 commit 72f3382

8 files changed

+58
-34
lines changed

‎demo/advanced/changeOptions.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,8 @@ function ChangeOptionsPromiseRendererCtrl($resource, DTOptionsBuilder, DTColumnB
9494
function ChangeOptionsNGRendererCtrl($resource, DTOptionsBuilder, DTColumnDefBuilder) {
9595
var vm = this;
9696
vm.persons = [];
97-
vm.dtOptions = DTOptionsBuilder.newOptions();
97+
vm.dtOptions = DTOptionsBuilder.newOptions()
98+
.withLanguageSource('//cdn.datatables.net/plug-ins/3cfcc339e89/i18n/English.json');
9899
vm.dtColumnDefs = [
99100
DTColumnDefBuilder.newColumnDef(0),
100101
DTColumnDefBuilder.newColumnDef(1).notVisible(),
@@ -109,6 +110,7 @@ function ChangeOptionsNGRendererCtrl($resource, DTOptionsBuilder, DTColumnDefBui
109110

110111
function changeOptions() {
111112
vm.dtOptions.withPaginationType('full_numbers')
113+
.withLanguageSource('//cdn.datatables.net/plug-ins/3cfcc339e89/i18n/French.json')
112114
.withDisplayLength(2)
113115
.withDOM('pitrfl');
114116
}

‎demo/api/apiOptionsBuilder.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -224,9 +224,9 @@ <h3><code>DTOptionsBuilder</code></h3>
224224
</tr>
225225
<tr>
226226
<td><code>DTOptions</code></td>
227-
<td><code>withLanguageSource(oLanguage)</code></td>
227+
<td><code>withLanguageSource(sLanguageSource)</code></td>
228228
<td>
229-
<p>Set the language source of the datatables. If not defined, it uses the default language set by datables, ie english.</p>
229+
<p>Set the language source of the datatables. If not defined, it uses the default language set by datatables, ie english.</p>
230230
<p>You can find the list of languages in the <a href="https://datatables.net/plug-ins/i18n/">DataTable official's documentation</a>.</p>
231231
<div hljs language="js">
232232
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl);
@@ -242,7 +242,7 @@ <h3><code>DTOptionsBuilder</code></h3>
242242
<td><code>DTOptions</code></td>
243243
<td><code>withLanguage(oLanguage)</code></td>
244244
<td>
245-
<p>Set the language of the datatables. If not defined, it uses the default language set by datables, ie english.</p>
245+
<p>Set the language of the datatables. If not defined, it uses the default language set by datatables, ie english.</p>
246246
<div hljs language="js">
247247
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl);
248248
function MyCtrl(DTOptionsBuilder) {

‎dist/angular-datatables.js

Lines changed: 26 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -167,7 +167,7 @@ function dtBootstrap(DTBootstrapTableTools, DTBootstrapColVis, DTBootstrapDefaul
167167
pageButton: {
168168
_: function (settings, host, idx, buttons, page, pages) {
169169
var classes = settings.oClasses;
170-
var lang = settings.oLanguage.oPaginate;
170+
var lang = settings.language.oPaginate;
171171
var btnDisplay, btnClass, counter = 0;
172172
var paginationClasses = DTPropertyUtil.overrideProperties(
173173
DTBootstrapDefaultOptions.getOptions().pagination,
@@ -439,7 +439,7 @@ angular.module('datatables.directive', ['datatables.instances', 'datatables.rend
439439
.directive('datatable', dataTable);
440440

441441
/* @ngInject */
442-
function dataTable($q, DTBootstrap, DTRendererFactory, DTRendererService, DTPropertyUtil) {
442+
function dataTable($q, $http, DTBootstrap, DTRendererFactory, DTRendererService, DTPropertyUtil) {
443443
compileDirective.$inject = ['tElm'];
444444
ControllerDirective.$inject = ['$scope'];
445445
return {
@@ -512,6 +512,17 @@ function dataTable($q, DTBootstrap, DTRendererFactory, DTRendererService, DTProp
512512
if (angular.isArray(dtColumnDefs)) {
513513
options.aoColumnDefs = dtColumnDefs;
514514
}
515+
516+
// HACK to resolve the language source manually instead of DT
517+
// See https://github.com/l-lin/angular-datatables/issues/181
518+
if (options.language && options.language.url) {
519+
var languageDefer = $q.defer();
520+
$http.get(options.language.url).success(function (language) {
521+
languageDefer.resolve(language);
522+
});
523+
options.language = languageDefer.promise;
524+
}
525+
515526
// Integrate bootstrap (or not)
516527
if (options.integrateBootstrap) {
517528
DTBootstrap.integrate(options);
@@ -532,20 +543,20 @@ function dataTable($q, DTBootstrap, DTRendererFactory, DTRendererService, DTProp
532543
// Render dataTable
533544
if (_dtInstance && _dtInstance._renderer) {
534545
_dtInstance._renderer.withOptions(options)
535-
.render($scope, $elem, staticHTML).then(function (dtInstance) {
546+
.render($elem, $scope, staticHTML).then(function (dtInstance) {
536547
_dtInstance = dtInstance;
537548
});
538549
} else {
539550
DTRendererFactory.fromOptions(options, isNgDisplay)
540-
.render($scope, $elem, staticHTML).then(function (dtInstance) {
551+
.render($elem, $scope, staticHTML).then(function (dtInstance) {
541552
_dtInstance = dtInstance;
542553
});
543554
}
544555
});
545556
}
546557
}
547558
}
548-
dataTable.$inject = ['$q', 'DTBootstrap', 'DTRendererFactory', 'DTRendererService', 'DTPropertyUtil'];
559+
dataTable.$inject = ['$q', '$http', 'DTBootstrap', 'DTRendererFactory', 'DTRendererService', 'DTPropertyUtil'];
549560

550561
'use strict';
551562
angular.module('datatables.factory', ['datatables.bootstrap', 'datatables.options'])
@@ -679,22 +690,22 @@ function dtOptionsBuilder(DT_DEFAULT_OPTIONS) {
679690

680691
/**
681692
* Set the language of the datatables
682-
* @param oLanguage the language
693+
* @param language the language
683694
* @returns {DTOptions} the options
684695
*/
685-
withLanguage: function(oLanguage) {
686-
this.oLanguage = oLanguage;
696+
withLanguage: function(language) {
697+
this.language = language;
687698
return this;
688699
},
689700

690701
/**
691702
* Set the language source
692-
* @param sLanguageSource the language source
703+
* @param languageSource the language source
693704
* @returns {DTOptions} the options
694705
*/
695-
withLanguageSource: function(sLanguageSource) {
706+
withLanguageSource: function(languageSource) {
696707
return this.withLanguage({
697-
sUrl: sLanguageSource
708+
url: languageSource
698709
});
699710
},
700711

@@ -1447,7 +1458,7 @@ function dtDefaultRenderer($q, DTRenderer, DTRendererService, DTInstanceFactory,
14471458
renderer.reloadData = reloadData;
14481459
renderer.changeData = changeData;
14491460

1450-
function render($scope, $elem) {
1461+
function render($elem) {
14511462
var dtInstance = DTInstanceFactory.newDTInstance(renderer);
14521463
var result = DTRendererService.hideLoadingAndRenderDataTable($elem, renderer.options);
14531464
return $q.when(DTInstances.register(dtInstance, result));
@@ -1490,7 +1501,7 @@ function dtNGRenderer($log, $q, $compile, $timeout, DTRenderer, DTRendererServic
14901501
renderer.rerender = rerender;
14911502
return renderer;
14921503

1493-
function render($scope, $elem, staticHTML) {
1504+
function render($elem, $scope, staticHTML) {
14941505
_staticHTML = staticHTML;
14951506
_$elem = $elem;
14961507
_parentScope = $scope.$parent;
@@ -1577,7 +1588,7 @@ function dtPromiseRenderer($q, $timeout, $log, DTRenderer, DTRendererService, DT
15771588
renderer.changeData = changeData;
15781589
return renderer;
15791590

1580-
function render($scope, $elem) {
1591+
function render($elem) {
15811592
var defer = $q.defer();
15821593
dtInstance = DTInstanceFactory.newDTInstance(renderer);
15831594
_$elem = $elem;
@@ -1685,7 +1696,7 @@ function dtAjaxRenderer($q, $timeout, DTRenderer, DTRendererService, DT_DEFAULT_
16851696
renderer.changeData = changeData;
16861697
return renderer;
16871698

1688-
function render($scope, $elem) {
1699+
function render($elem) {
16891700
var defer = $q.defer();
16901701
var dtInstance = DTInstanceFactory.newDTInstance(renderer);
16911702
// Define default values in case it is an ajax datatables

‎dist/angular-datatables.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/angular-datatables.bootstrap.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -153,7 +153,7 @@ function dtBootstrap(DTBootstrapTableTools, DTBootstrapColVis, DTBootstrapDefaul
153153
pageButton: {
154154
_: function (settings, host, idx, buttons, page, pages) {
155155
var classes = settings.oClasses;
156-
var lang = settings.oLanguage.oPaginate;
156+
var lang = settings.language.oPaginate;
157157
var btnDisplay, btnClass, counter = 0;
158158
var paginationClasses = DTPropertyUtil.overrideProperties(
159159
DTBootstrapDefaultOptions.getOptions().pagination,

‎src/angular-datatables.directive.js

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ angular.module('datatables.directive', ['datatables.instances', 'datatables.rend
44
.directive('datatable', dataTable);
55

66
/* @ngInject */
7-
function dataTable($q, DTBootstrap, DTRendererFactory, DTRendererService, DTPropertyUtil) {
7+
function dataTable($q, $http, DTBootstrap, DTRendererFactory, DTRendererService, DTPropertyUtil) {
88
return {
99
restrict: 'A',
1010
scope: {
@@ -75,6 +75,17 @@ function dataTable($q, DTBootstrap, DTRendererFactory, DTRendererService, DTProp
7575
if (angular.isArray(dtColumnDefs)) {
7676
options.aoColumnDefs = dtColumnDefs;
7777
}
78+
79+
// HACK to resolve the language source manually instead of DT
80+
// See https://github.com/l-lin/angular-datatables/issues/181
81+
if (options.language && options.language.url) {
82+
var languageDefer = $q.defer();
83+
$http.get(options.language.url).success(function (language) {
84+
languageDefer.resolve(language);
85+
});
86+
options.language = languageDefer.promise;
87+
}
88+
7889
// Integrate bootstrap (or not)
7990
if (options.integrateBootstrap) {
8091
DTBootstrap.integrate(options);
@@ -95,12 +106,12 @@ function dataTable($q, DTBootstrap, DTRendererFactory, DTRendererService, DTProp
95106
// Render dataTable
96107
if (_dtInstance && _dtInstance._renderer) {
97108
_dtInstance._renderer.withOptions(options)
98-
.render($scope, $elem, staticHTML).then(function (dtInstance) {
109+
.render($elem, $scope, staticHTML).then(function (dtInstance) {
99110
_dtInstance = dtInstance;
100111
});
101112
} else {
102113
DTRendererFactory.fromOptions(options, isNgDisplay)
103-
.render($scope, $elem, staticHTML).then(function (dtInstance) {
114+
.render($elem, $scope, staticHTML).then(function (dtInstance) {
104115
_dtInstance = dtInstance;
105116
});
106117
}

‎src/angular-datatables.factory.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -130,22 +130,22 @@ function dtOptionsBuilder(DT_DEFAULT_OPTIONS) {
130130

131131
/**
132132
* Set the language of the datatables
133-
* @param oLanguage the language
133+
* @param language the language
134134
* @returns {DTOptions} the options
135135
*/
136-
withLanguage: function(oLanguage) {
137-
this.oLanguage = oLanguage;
136+
withLanguage: function(language) {
137+
this.language = language;
138138
return this;
139139
},
140140

141141
/**
142142
* Set the language source
143-
* @param sLanguageSource the language source
143+
* @param languageSource the language source
144144
* @returns {DTOptions} the options
145145
*/
146-
withLanguageSource: function(sLanguageSource) {
146+
withLanguageSource: function(languageSource) {
147147
return this.withLanguage({
148-
sUrl: sLanguageSource
148+
url: languageSource
149149
});
150150
},
151151

‎src/angular-datatables.renderer.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ function dtDefaultRenderer($q, DTRenderer, DTRendererService, DTInstanceFactory,
7979
renderer.reloadData = reloadData;
8080
renderer.changeData = changeData;
8181

82-
function render($scope, $elem) {
82+
function render($elem) {
8383
var dtInstance = DTInstanceFactory.newDTInstance(renderer);
8484
var result = DTRendererService.hideLoadingAndRenderDataTable($elem, renderer.options);
8585
return $q.when(DTInstances.register(dtInstance, result));
@@ -121,7 +121,7 @@ function dtNGRenderer($log, $q, $compile, $timeout, DTRenderer, DTRendererServic
121121
renderer.rerender = rerender;
122122
return renderer;
123123

124-
function render($scope, $elem, staticHTML) {
124+
function render($elem, $scope, staticHTML) {
125125
_staticHTML = staticHTML;
126126
_$elem = $elem;
127127
_parentScope = $scope.$parent;
@@ -207,7 +207,7 @@ function dtPromiseRenderer($q, $timeout, $log, DTRenderer, DTRendererService, DT
207207
renderer.changeData = changeData;
208208
return renderer;
209209

210-
function render($scope, $elem) {
210+
function render($elem) {
211211
var defer = $q.defer();
212212
dtInstance = DTInstanceFactory.newDTInstance(renderer);
213213
_$elem = $elem;
@@ -314,7 +314,7 @@ function dtAjaxRenderer($q, $timeout, DTRenderer, DTRendererService, DT_DEFAULT_
314314
renderer.changeData = changeData;
315315
return renderer;
316316

317-
function render($scope, $elem) {
317+
function render($elem) {
318318
var defer = $q.defer();
319319
var dtInstance = DTInstanceFactory.newDTInstance(renderer);
320320
// Define default values in case it is an ajax datatables

0 commit comments

Comments
 (0)