How to use updateData for adding/updating/removing partial data

Data source

by ilaria_nunziante

HTML

<link rel="stylesheet" href="https://cdn.flexmonster.com/2.3/demo.css">
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>
<button id="btn" onclick="updateRecord()">Update</button><button id="btn" onclick="deleteRecord()">Delete</button>
<div id="pivot-container"></div>

JavaScript

var pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  width: "100%",
  height: 430,
  report: {
    "dataSource": {
      "type": "json",
      "data": [{
          "RowId": "1",
          "Product": "Bisquits",
          "Category": "Dessert",
          "Quantity": 100
        },
        {
          "RowId": "2",
          "Product": "Cake",
          "Category": "Dessert",
          "Quantity": 100
        }
      ],
      "mapping": {
        "Category": {
          "type": "string"
        },
        "Product": {
          "type": "string"
        },
        "Quantity": {
          "type": "number"
        },
        "DeleteRow": {
          "type": "delete"
        },
        "RowId": {
          "type": "id"
        }
      }
    },
    "slice": {
      "rows": [{
        "uniqueName": "Category"
      }],
      "columns": [{
        "uniqueName": "[Measures]"
      }],
      "measures": [{
        "uniqueName": "Quantity",
        "aggregation": "sum"
      }]
    }
  }
});

function update(data) {
  flexmonster.updateData({
    data: data
  }, {
    partial: true
  });
}

function updateRecord() {
  var data = [{
    "RowId": "1",
    "Product": "Bisquits",
    "Category": "Dessert",
    "Quantity": 200
  }];
  update(data);
}

function deleteRecord() {
debugger;
  var data = [{
    "RowId": "1",
    "Product": "Bisquits",
    "Category": "Dessert",
    "Quantity": 0,
    "DeleteRow": true
  }];
  update(data);
}