1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199 | 1×
1×
1×
1×
1×
149×
149×
149×
1×
8381×
1×
149×
149×
149×
149×
1×
149×
149×
149×
1×
7×
7×
1×
297×
297×
296×
296×
296×
296×
296×
296×
2746×
2726×
20×
2746×
2746×
2746×
296×
296×
296×
296×
2368×
2368×
2352×
1×
344×
1×
1×
1×
21×
1×
344×
344×
1×
28×
1×
377×
149×
228×
228×
231×
231×
228×
1×
39×
39×
4×
2×
2×
2×
2×
2×
4×
4×
35×
35×
35×
35×
1×
137×
11×
11×
1×
39×
17×
17×
39×
39×
1×
149×
149×
149×
1×
38×
4×
4×
1×
149×
149×
149×
149×
149×
149×
149×
149×
149×
1×
116×
115×
1×
1×
1×
1×
1×
1×
1×
1×
116×
116×
1×
265×
116×
115×
1×
1×
1×
| define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "../../pager/pager", "../../pager/pager-dropdown", "../../pager/external-message", "../base/util", "../base/constant"], function (require, exports, ej2_base_1, ej2_base_2, pager_1, pager_dropdown_1, external_message_1, util_1, events) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
pager_1.Pager.Inject(external_message_1.ExternalMessage, pager_dropdown_1.PagerDropDown);
var Page = (function () {
function Page(parent, pageSettings) {
this.parent = parent;
this.pageSettings = pageSettings;
this.addEventListener();
}
Page.prototype.getModuleName = function () {
return 'pager';
};
Page.prototype.render = function () {
var gObj = this.parent;
var pagerObj;
this.pagerDestroy();
if (!ej2_base_2.isNullOrUndefined(this.parent.pagerTemplate)) {
this.pageSettings.template = this.parent.pagerTemplate;
}
this.element = ej2_base_2.createElement('div', { className: 'e-gridpager' });
pagerObj = util_1.extend({}, ej2_base_1.extend({}, util_1.getActualProperties(this.pageSettings)), {
click: this.clickHandler.bind(this),
dropDownChanged: this.onSelect.bind(this),
enableRtl: gObj.enableRtl, locale: gObj.locale,
created: this.addAriaAttr.bind(this)
}, ['parentObj', 'propName']);
this.pagerObj = new pager_1.Pager(pagerObj);
};
Page.prototype.onSelect = function (e) {
this.pageSettings.pageSize = e.pageSize;
this.pageSettings.currentPage = 1;
};
Page.prototype.addAriaAttr = function () {
var _this = this;
if (!(this.pageSettings.template)) {
var numericContainerNew = ej2_base_2.createElement('div', { className: 'e-numericcontainer' });
var pagerContainer = this.element.querySelector('.e-pagercontainer');
var frag = document.createDocumentFragment();
var numericContainer = this.element.querySelector('.e-numericcontainer');
var links = numericContainer.querySelectorAll('a');
for (var i = 0; i < links.length; i++) {
if (this.parent.getContentTable()) {
links[i].setAttribute('aria-owns', this.parent.getContentTable().id);
}
else {
links[i].setAttribute('aria-owns', this.parent.element.getAttribute('id') + '_content_table');
}
var numericContainerDiv = ej2_base_2.createElement('div');
numericContainerDiv.appendChild(links[i]);
frag.appendChild(numericContainerDiv);
}
numericContainerNew.appendChild(frag);
pagerContainer.replaceChild(numericContainerNew, numericContainer);
var classList = ['.e-mfirst', '.e-mprev', '.e-first', '.e-prev', '.e-next', '.e-last', '.e-mnext', '.e-mlast'];
classList.forEach(function (value) {
var element = _this.element.querySelector(value);
if (_this.parent.getContentTable()) {
element.setAttribute('aria-owns', _this.parent.getContentTable().id);
}
});
}
};
Page.prototype.dataReady = function (e) {
this.updateModel(e);
};
Page.prototype.refresh = function () {
this.pagerObj.refresh();
};
Page.prototype.goToPage = function (pageNo) {
this.pagerObj.goToPage(pageNo);
};
Page.prototype.updateModel = function (e) {
this.parent.pageSettings.totalRecordsCount = e.count;
this.parent.dataBind();
};
Page.prototype.onActionComplete = function (e) {
this.parent.trigger(events.actionComplete, ej2_base_1.extend(e, {
currentPage: this.parent.pageSettings.currentPage, requestType: 'paging',
type: events.actionComplete
}));
};
Page.prototype.onPropertyChanged = function (e) {
if (e.module !== this.getModuleName()) {
return;
}
var newProp = e.properties;
for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {
var prop = _a[_i];
this.pagerObj[prop] = newProp[prop];
}
this.pagerObj.dataBind();
};
Page.prototype.clickHandler = function (e) {
var gObj = this.parent;
if (this.isForceCancel || util_1.isActionPrevent(gObj) && !gObj.prevPageMoving) {
if (!this.isForceCancel) {
gObj.notify(events.preventBatch, { instance: this, handler: this.goToPage, arg1: e.currentPage });
this.isForceCancel = true;
this.pagerObj.currentPage = gObj.pageSettings.currentPage;
this.pagerObj.dataBind();
}
else {
this.isForceCancel = false;
}
e.cancel = true;
return;
}
gObj.prevPageMoving = false;
var prevPage = this.pageSettings.currentPage;
this.pageSettings.currentPage = e.currentPage;
this.parent.notify(events.modelChanged, {
requestType: 'paging',
previousPage: prevPage,
currentPage: e.currentPage,
type: events.actionBegin
});
};
Page.prototype.keyPressHandler = function (e) {
if (e.action in keyActions) {
e.preventDefault();
this.element.querySelector(keyActions[e.action]).click();
}
};
Page.prototype.updateExternalMessage = function (message) {
if (!this.pagerObj.enableExternalMessage) {
this.pagerObj.enableExternalMessage = true;
this.pagerObj.dataBind();
}
this.pagerObj.externalMessage = message;
this.pagerObj.dataBind();
};
Page.prototype.appendToElement = function (e) {
this.parent.element.appendChild(this.element);
this.parent.setGridPager(this.element);
this.pagerObj.appendTo(this.element);
};
Page.prototype.enableAfterRender = function (e) {
if (e.module === this.getModuleName() && e.enable) {
this.render();
this.appendToElement();
}
};
Page.prototype.addEventListener = function () {
this.handlers = {
load: this.render,
end: this.appendToElement,
ready: this.dataReady,
complete: this.onActionComplete,
updateLayout: this.enableAfterRender,
inboundChange: this.onPropertyChanged,
keyPress: this.keyPressHandler
};
Iif (this.parent.isDestroyed) {
return;
}
this.parent.on(events.initialLoad, this.handlers.load, this);
this.parent.on(events.initialEnd, this.handlers.end, this);
this.parent.on(events.dataReady, this.handlers.ready, this);
this.parent.on(events.pageComplete, this.handlers.complete, this);
this.parent.on(events.uiUpdate, this.handlers.updateLayout, this);
this.parent.on(events.inBoundModelChanged, this.handlers.inboundChange, this);
this.parent.on(events.keyPressed, this.handlers.keyPress, this);
};
Page.prototype.removeEventListener = function () {
if (this.parent.isDestroyed) {
return;
}
this.parent.off(events.initialLoad, this.handlers.load);
this.parent.off(events.initialEnd, this.handlers.end);
this.parent.off(events.dataReady, this.handlers.ready);
this.parent.off(events.pageComplete, this.handlers.complete);
this.parent.off(events.uiUpdate, this.handlers.updateLayout);
this.parent.off(events.inBoundModelChanged, this.handlers.inboundChange);
this.parent.off(events.keyPressed, this.handlers.keyPress);
};
Page.prototype.destroy = function () {
this.removeEventListener();
this.pagerDestroy();
};
Page.prototype.pagerDestroy = function () {
if (this.pagerObj && !this.pagerObj.isDestroyed) {
this.pagerObj.destroy();
ej2_base_2.remove(this.element);
}
};
return Page;
}());
exports.Page = Page;
var keyActions = {
pageUp: '.e-prev',
pageDown: '.e-next',
ctrlAltPageDown: '.e-last',
ctrlAltPageUp: '.e-first',
altPageUp: '.e-pp',
altPageDown: '.e-np'
};
});
|