Pivot widget expects a backend server to fetch data. You can provide a link to it by the url setting:
webix.ui({
view: "pivot",
url:"http://localhost:3200/" });
Pivot will load and save data using the specified URL.
Sample backend for Pivot is available for downloading.
If you do not have a backend server, you can customize the methods of the Backend service and provide client-side data as a promise.
You can configure Pivot to do all calculations on the server side. To do this, set externalProcessing property to true.
As we mentioned before, a sample server is available for download to license owners as a zip file via the client area. You can also use your own server.
When changes are made, Pivot sends a request to url/data with the following parameters: {structure, mode, table(?)} ,and waits for the server to load the new aggregate data.
If a user opens a filter, he gets field values from url/fields/id.
If you want to get the config from the server, you can call webix.ajax before view initialization:
webix.ajax(url + "config").then(res => {
webix.ui(
webix.extend({
view: "pivot",
...
},
res.json()
)
);
});
In case you are using your own server, change the parameters of the AJAX request to the path to your config.
Backend service is a server-side model that contains methods for sending requests.
Check out the full list of methods below.
To change data requests, get and process the responses you can:
class MyBackend extends pivot.services.Backend {
// define and override methods here
}
webix.ui({
view: "pivot",
url:"http://localhost:3200/",
override: new Map([[pivot.services.Backend, MyBackend]]),
});
You can send AJAX requests to your server by using the needed URLs, e.g.:
Adding an event
class MyBackend extends pivot.services.Backend {
data() {
return webix.ajax.get("//localhost:3200/")
.then(res => res.json());
}
}
If you need to fill Pivot with client-side data, you can return it as a promise inside the following methods:
Client-side data
class MyBackend extends pivot.services.Backend {
data() {
return webix.promise.resolve(pivotData);
}
}
Related sample: Pivot: Local Data
Below you can find descriptions of the following methods:
Is called upon widget initialization to load data into Pivot.
Returns: a promise that resolves with an array of data objects.
Request:
GET http://localhost:3000/
Response:
The server returns an array of data objects. If externalProcessing: true, returns aggregated data.
[
{
"name": "Argentina",
"year": 2005,
"continent": "South America",
"form": "Republic",
"gdp": 181.357,
"oil": 1.545,
"balance": 4.699
},
// other objects
]
This method collects field values. Works only with externalProcessing: true.
Returns: a promise that resolves with an array of data objects.
Response:
The server returns an array of data objects: [ { id, value, label }, ... ].
Back to top