🎉 Flexmonster Pivot Table & Charts v2.8 has arrived!Read the blog post
Get Free Trial
Get Free Trial

How to load data using a custom method

visualbbasic asked on February 13, 2020

I’m using Flexmonster Vue pivot table component and need to populate data using a custom method instead of pointing to a data source using a URL. 

data: Object = {
dataSource: {
type: 'json',
filename: 'localhost:13500/zzzz?a=2020-02-20&b=2020-02-21',

instead of doing this, is it possible to give a method such as:

data: Object = {
dataSource: {
type: 'json',
filename: () => { return ajaxCall() },


1 answer

Illia Yatsyshyn Illia Yatsyshyn Flexmonster 7 days ago

Thank you for reaching out to us.
Our team would like to kindly inform you that the described implementation is possible. In order to achieve that, the data property of the dataSource object should be used instead of the filename property. The filename property is dedicated to specifying the URL of the file containing a data set or script generating it. In turn, the data property serves to point to inline JSON or the function providing it.
More information about the dataSource object and its properties, including the data property, can be found following the link: Data Source Object.
Please note that due to asynchronous nature of Ajax functions the data may not be generated and returned before Flexmonster tries to load it. Therefore we recommend connecting to the data source after the component is created with an empty report and the Vue itself is mounted. It is achievable using the following structure:

mounted() {
    ajaxData((data) => {
        this.$refs.pivot.flexmonster.connectTo({ data });

where the connectTo API call serves in order to connect to the generated data set.
More information about the method can be found following the link.
We hope it works for you.
Best regards,

Please login or Register to Submit Answer