123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465 |
- var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
- /* Tabulator v4.6.3 (c) Oliver Folkerd */
-
- var Ajax = function Ajax(table) {
-
- this.table = table; //hold Tabulator object
- this.config = false; //hold config object for ajax request
- this.url = ""; //request URL
- this.urlGenerator = false;
- this.params = false; //request parameters
-
- this.loaderElement = this.createLoaderElement(); //loader message div
- this.msgElement = this.createMsgElement(); //message element
- this.loadingElement = false;
- this.errorElement = false;
- this.loaderPromise = false;
-
- this.progressiveLoad = false;
- this.loading = false;
-
- this.requestOrder = 0; //prevent requests comming out of sequence if overridden by another load request
- };
-
- //initialize setup options
- Ajax.prototype.initialize = function () {
- var template;
-
- this.loaderElement.appendChild(this.msgElement);
-
- if (this.table.options.ajaxLoaderLoading) {
- if (typeof this.table.options.ajaxLoaderLoading == "string") {
- template = document.createElement('template');
- template.innerHTML = this.table.options.ajaxLoaderLoading.trim();
- this.loadingElement = template.content.firstChild;
- } else {
- this.loadingElement = this.table.options.ajaxLoaderLoading;
- }
- }
-
- this.loaderPromise = this.table.options.ajaxRequestFunc || this.defaultLoaderPromise;
-
- this.urlGenerator = this.table.options.ajaxURLGenerator || this.defaultURLGenerator;
-
- if (this.table.options.ajaxLoaderError) {
- if (typeof this.table.options.ajaxLoaderError == "string") {
- template = document.createElement('template');
- template.innerHTML = this.table.options.ajaxLoaderError.trim();
- this.errorElement = template.content.firstChild;
- } else {
- this.errorElement = this.table.options.ajaxLoaderError;
- }
- }
-
- if (this.table.options.ajaxParams) {
- this.setParams(this.table.options.ajaxParams);
- }
-
- if (this.table.options.ajaxConfig) {
- this.setConfig(this.table.options.ajaxConfig);
- }
-
- if (this.table.options.ajaxURL) {
- this.setUrl(this.table.options.ajaxURL);
- }
-
- if (this.table.options.ajaxProgressiveLoad) {
- if (this.table.options.pagination) {
- this.progressiveLoad = false;
- console.error("Progressive Load Error - Pagination and progressive load cannot be used at the same time");
- } else {
- if (this.table.modExists("page")) {
- this.progressiveLoad = this.table.options.ajaxProgressiveLoad;
- this.table.modules.page.initializeProgressive(this.progressiveLoad);
- } else {
- console.error("Pagination plugin is required for progressive ajax loading");
- }
- }
- }
- };
-
- Ajax.prototype.createLoaderElement = function () {
- var el = document.createElement("div");
- el.classList.add("tabulator-loader");
- return el;
- };
-
- Ajax.prototype.createMsgElement = function () {
- var el = document.createElement("div");
-
- el.classList.add("tabulator-loader-msg");
- el.setAttribute("role", "alert");
-
- return el;
- };
-
- //set ajax params
- Ajax.prototype.setParams = function (params, update) {
- if (update) {
- this.params = this.params || {};
-
- for (var key in params) {
- this.params[key] = params[key];
- }
- } else {
- this.params = params;
- }
- };
-
- Ajax.prototype.getParams = function () {
- return this.params || {};
- };
-
- //load config object
- Ajax.prototype.setConfig = function (config) {
- this._loadDefaultConfig();
-
- if (typeof config == "string") {
- this.config.method = config;
- } else {
- for (var key in config) {
- this.config[key] = config[key];
- }
- }
- };
-
- //create config object from default
- Ajax.prototype._loadDefaultConfig = function (force) {
- var self = this;
- if (!self.config || force) {
-
- self.config = {};
-
- //load base config from defaults
- for (var key in self.defaultConfig) {
- self.config[key] = self.defaultConfig[key];
- }
- }
- };
-
- //set request url
- Ajax.prototype.setUrl = function (url) {
- this.url = url;
- };
-
- //get request url
- Ajax.prototype.getUrl = function () {
- return this.url;
- };
-
- //lstandard loading function
- Ajax.prototype.loadData = function (inPosition, columnsChanged) {
- var self = this;
-
- if (this.progressiveLoad) {
- return this._loadDataProgressive();
- } else {
- return this._loadDataStandard(inPosition, columnsChanged);
- }
- };
-
- Ajax.prototype.nextPage = function (diff) {
- var margin;
-
- if (!this.loading) {
-
- margin = this.table.options.ajaxProgressiveLoadScrollMargin || this.table.rowManager.getElement().clientHeight * 2;
-
- if (diff < margin) {
- this.table.modules.page.nextPage().then(function () {}).catch(function () {});
- }
- }
- };
-
- Ajax.prototype.blockActiveRequest = function () {
- this.requestOrder++;
- };
-
- Ajax.prototype._loadDataProgressive = function () {
- this.table.rowManager.setData([]);
- return this.table.modules.page.setPage(1);
- };
-
- Ajax.prototype._loadDataStandard = function (inPosition, columnsChanged) {
- var _this = this;
-
- return new Promise(function (resolve, reject) {
- _this.sendRequest(inPosition).then(function (data) {
- _this.table.rowManager.setData(data, inPosition, columnsChanged).then(function () {
- resolve();
- }).catch(function (e) {
- reject(e);
- });
- }).catch(function (e) {
- reject(e);
- });
- });
- };
-
- Ajax.prototype.generateParamsList = function (data, prefix) {
- var self = this,
- output = [];
-
- prefix = prefix || "";
-
- if (Array.isArray(data)) {
- data.forEach(function (item, i) {
- output = output.concat(self.generateParamsList(item, prefix ? prefix + "[" + i + "]" : i));
- });
- } else if ((typeof data === "undefined" ? "undefined" : _typeof(data)) === "object") {
- for (var key in data) {
- output = output.concat(self.generateParamsList(data[key], prefix ? prefix + "[" + key + "]" : key));
- }
- } else {
- output.push({ key: prefix, value: data });
- }
-
- return output;
- };
-
- Ajax.prototype.serializeParams = function (params) {
- var output = this.generateParamsList(params),
- encoded = [];
-
- output.forEach(function (item) {
- encoded.push(encodeURIComponent(item.key) + "=" + encodeURIComponent(item.value));
- });
-
- return encoded.join("&");
- };
-
- //send ajax request
- Ajax.prototype.sendRequest = function (silent) {
- var _this2 = this;
-
- var self = this,
- url = self.url,
- requestNo,
- esc,
- query;
-
- self.requestOrder++;
- requestNo = self.requestOrder;
-
- self._loadDefaultConfig();
-
- return new Promise(function (resolve, reject) {
- if (self.table.options.ajaxRequesting.call(_this2.table, self.url, self.params) !== false) {
-
- self.loading = true;
-
- if (!silent) {
- self.showLoader();
- }
-
- _this2.loaderPromise(url, self.config, self.params).then(function (data) {
- if (requestNo === self.requestOrder) {
- if (self.table.options.ajaxResponse) {
- data = self.table.options.ajaxResponse.call(self.table, self.url, self.params, data);
- }
- resolve(data);
-
- self.hideLoader();
- self.loading = false;
- } else {
- console.warn("Ajax Response Blocked - An active ajax request was blocked by an attempt to change table data while the request was being made");
- }
- }).catch(function (error) {
- console.error("Ajax Load Error: ", error);
- self.table.options.ajaxError.call(self.table, error);
-
- self.showError();
-
- setTimeout(function () {
- self.hideLoader();
- }, 3000);
-
- self.loading = false;
-
- reject();
- });
- } else {
- reject();
- }
- });
- };
-
- Ajax.prototype.showLoader = function () {
- var shouldLoad = typeof this.table.options.ajaxLoader === "function" ? this.table.options.ajaxLoader() : this.table.options.ajaxLoader;
-
- if (shouldLoad) {
-
- this.hideLoader();
-
- while (this.msgElement.firstChild) {
- this.msgElement.removeChild(this.msgElement.firstChild);
- }this.msgElement.classList.remove("tabulator-error");
- this.msgElement.classList.add("tabulator-loading");
-
- if (this.loadingElement) {
- this.msgElement.appendChild(this.loadingElement);
- } else {
- this.msgElement.innerHTML = this.table.modules.localize.getText("ajax|loading");
- }
-
- this.table.element.appendChild(this.loaderElement);
- }
- };
-
- Ajax.prototype.showError = function () {
- this.hideLoader();
-
- while (this.msgElement.firstChild) {
- this.msgElement.removeChild(this.msgElement.firstChild);
- }this.msgElement.classList.remove("tabulator-loading");
- this.msgElement.classList.add("tabulator-error");
-
- if (this.errorElement) {
- this.msgElement.appendChild(this.errorElement);
- } else {
- this.msgElement.innerHTML = this.table.modules.localize.getText("ajax|error");
- }
-
- this.table.element.appendChild(this.loaderElement);
- };
-
- Ajax.prototype.hideLoader = function () {
- if (this.loaderElement.parentNode) {
- this.loaderElement.parentNode.removeChild(this.loaderElement);
- }
- };
-
- //default ajax config object
- Ajax.prototype.defaultConfig = {
- method: "GET"
- };
-
- Ajax.prototype.defaultURLGenerator = function (url, config, params) {
-
- if (url) {
- if (params && Object.keys(params).length) {
- if (!config.method || config.method.toLowerCase() == "get") {
- config.method = "get";
-
- url += (url.includes("?") ? "&" : "?") + this.serializeParams(params);
- }
- }
- }
-
- return url;
- };
-
- Ajax.prototype.defaultLoaderPromise = function (url, config, params) {
- var self = this,
- contentType;
-
- return new Promise(function (resolve, reject) {
-
- //set url
- url = self.urlGenerator(url, config, params);
-
- //set body content if not GET request
- if (config.method.toUpperCase() != "GET") {
- contentType = _typeof(self.table.options.ajaxContentType) === "object" ? self.table.options.ajaxContentType : self.contentTypeFormatters[self.table.options.ajaxContentType];
- if (contentType) {
-
- for (var key in contentType.headers) {
- if (!config.headers) {
- config.headers = {};
- }
-
- if (typeof config.headers[key] === "undefined") {
- config.headers[key] = contentType.headers[key];
- }
- }
-
- config.body = contentType.body.call(self, url, config, params);
- } else {
- console.warn("Ajax Error - Invalid ajaxContentType value:", self.table.options.ajaxContentType);
- }
- }
-
- if (url) {
-
- //configure headers
- if (typeof config.headers === "undefined") {
- config.headers = {};
- }
-
- if (typeof config.headers.Accept === "undefined") {
- config.headers.Accept = "application/json";
- }
-
- if (typeof config.headers["X-Requested-With"] === "undefined") {
- config.headers["X-Requested-With"] = "XMLHttpRequest";
- }
-
- if (typeof config.mode === "undefined") {
- config.mode = "cors";
- }
-
- if (config.mode == "cors") {
-
- if (typeof config.headers["Access-Control-Allow-Origin"] === "undefined") {
- config.headers["Access-Control-Allow-Origin"] = window.location.origin;
- }
-
- if (typeof config.credentials === "undefined") {
- config.credentials = 'same-origin';
- }
- } else {
- if (typeof config.credentials === "undefined") {
- config.credentials = 'include';
- }
- }
-
- //send request
- fetch(url, config).then(function (response) {
- if (response.ok) {
- response.json().then(function (data) {
- resolve(data);
- }).catch(function (error) {
- reject(error);
- console.warn("Ajax Load Error - Invalid JSON returned", error);
- });
- } else {
- console.error("Ajax Load Error - Connection Error: " + response.status, response.statusText);
- reject(response);
- }
- }).catch(function (error) {
- console.error("Ajax Load Error - Connection Error: ", error);
- reject(error);
- });
- } else {
- console.warn("Ajax Load Error - No URL Set");
- resolve([]);
- }
- });
- };
-
- Ajax.prototype.contentTypeFormatters = {
- "json": {
- headers: {
- 'Content-Type': 'application/json'
- },
- body: function body(url, config, params) {
- return JSON.stringify(params);
- }
- },
- "form": {
- headers: {},
- body: function body(url, config, params) {
- var output = this.generateParamsList(params),
- form = new FormData();
-
- output.forEach(function (item) {
- form.append(item.key, item.value);
- });
-
- return form;
- }
- }
- };
-
- Tabulator.prototype.registerModule("ajax", Ajax);
|