Add new record not working

Data source

by ilaria_nunziante

HTML

<link rel="stylesheet" href="https://cdn.flexmonster.com/2.3/demo.css">
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>
<button id="btnN" onclick="addNewProduct()">Add new product</button>
<button id="btnE" onclick="addExistingProduct()">Add existing product</button>
<br>
<span> Product count</span>
<input id="inpt" value=200 type="number" />
<button id="btnR" onclick="setReport()">Set Report</button>
<div id="pivot-container"></div>

JavaScript

function addNewProduct() {
  flexmonster.updateData({
    data: [{
      Category: "Category 1",
      Product: "New product",
      Price: 1,
      RowId: 1000
    }]
  }, {
    partial: true
  });
}

function addExistingProduct() {
  flexmonster.updateData({
    data: [{
      Category: "Category 1",
      Product: "Product 1",
      Price: 1,
      RowId: 2000
    }]
  }, {
    partial: true
  });
}

function setReport() {
  var productCount = $("#inpt").val();
  flexmonster.setReport(getReport(productCount));
}

function getData(productCount) {
  var data = [{
    "Category": {
      "type": "string",
      "caption": "Area"
    },
    "Product": {
      "type": "string",
      "caption": "Product"
    },
    "Price": {
      "type": "number",
      "caption": "Price"
    },
    "RowId": {
      "type": "id",
      "caption": "RowId"
    },
  }];
  data.push({
    Category: "Category 1",
    Product: "Product 0",
    Price: 1,
    RowId: 0
  });
  for (var productIndex = 1; productIndex < productCount; productIndex++) {
    data.push({
      Category: "Category 2",
      Product: "Product " + productIndex,
      Price: 1,
      RowId: productIndex
    });
  }
  return data;
}

var getReport = function(productCount) {
  return {
    dataSource: {
      data: getData(productCount)
    },
    slice: {
      rows: [{
          uniqueName: 'Category',
          caption: 'Category'
        },
        {
          uniqueName: 'Product',
          caption: 'Product'
        }
      ],
      columns: [{
        uniqueName: '[Measures]'
      }],
      measures: [{
        uniqueName: 'Price',
        caption: 'Price',
        aggregation: 'sum'
      }]
    }
  }
}

var pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  width: "100%",
  height: 430,
  report: getReport(200)
});