updateData

updateData(connectionParameters: Object, options: Object)

[starting from version: 2.3]

Helps to update data for the report without cleaning the report. Only the dataSource is updated, whereas the slice, all defined options, number and conditional formatting, the scroll position stay the same. For all data sources, updateData allows connecting to a new data source. For a JSON data source, it is also possible to update only some part of the data.

Parameters

• connectionParameters – Object. It contains connection parameters. The connectionParameters object has the same structure as the DataSourceObject.
• options (optional) – Object. Contains additional options:
  • partial (optional) – Boolean. Use partial to update data partially: add, update, or remove certain records of the JSON array. Only for the "json" data source type.
    To update only a part of the data, set partial to true and add a field of the "id" type to your dataset. For more information, check this example.
    Default value: false.
  • ignoreSorting (optional) – Boolean. Set ignoreSorting: true and current sorting defined in the report will be ignored when you update the data. Default value: false.
  • ignoreScroll (optional) – Boolean. Set ignoreScroll: true and current scroll position in the pivot table will be ignored when you update the data. Default value: false.

Examples

1) Update data from Microsoft Analysis Services:

flexmonster.updateData({
    type: 'microsoft analysis services',
    proxyUrl: 'https://olap.flexmonster.com/olap/msmdpump.dll',   
    catalog: 'Adventure Works DW Standard Edition',
    cube: 'Adventure Works' 
}); 

Open the example on JSFiddle.

2) Update data from CSV data source:

flexmonster.updateData({
    type: 'csv',
    filename: 'data/data.csv'
}); 

Try on JSFiddle.

3) Update data from JSON inline data:

let jsonData = [
  {
    "Category": "Accessories",
    "Size": "277 oz",
    "Color": "red",
    "Destination": "United Kingdom",
    "Business Type": "Warehouse",
    "Country": "United Kingdom",
    "Price": 1000,
    "Quantity": 730,
    "Discount": 38
  },
  {
    "Category": "Accessories",
    "Size": "47 oz",
    "Color": "white",
    "Destination": "United States",
    "Business Type": "Warehouse",
    "Country": "United States",
    "Price": 7941,
    "Quantity": 73,
    "Discount": 53
  },
  {
    "Category": "Bikes",
    "Size": "264 oz",
    "Color": "white",
    "Destination": "Australia",
    "Business Type": "Specialty Bike Shop",
    "Country": "Australia",
    "Price": 6829,
    "Quantity": 19,
    "Discount": 56
  }
];

flexmonster.updateData({ data: jsonData }); 

Check out on JSFiddle.

4) How to use updateData for adding/updating/removing partial data:

First of all, we add id and delete types to the mapping:

dataSource: {
    data: getData(),
    mapping: {
        "Category": { type: "string" },
        "Price": { type: "number" },
        "RowId": { type: "id" },
        "DeleteRow": { type: "delete" }
    }
}

Then, when defining the data, we specify an id field for every object the following way:

function getData() {
    return [
        {
            "Category": "Accessories",
            "Price": 242,   
            "RowId": 1 
        }
    ]
}

To add or update only some of the records, use partial: true:

let dataForUpdate = [{
      "Category": "Cars",
      "Price": 51844,
      "RowId": 4   	
}]
flexmonster.updateData({data: dataForUpdate}, {partial: true});

To delete the records, specify id and delete fields:

let dataForUpdate = [{
      "RowId": 3,
      "DeleteRow": true  	
}]
flexmonster.updateData({data: dataForUpdate}, {partial: true});

See a live example on JSFiddle.

See also

connectTo