How to add/remove columns and rows dynamically?

Hello, Ravi,
 
 
Thank you for writing to us.
 
 
The described functionality can be achieved in the following way:
 
 
1. Adding a new field (column)
 
A new field can be added via the getReport() and setReport() API calls:

// 1. Get new column name:
var columnName = "New Data"; 

// 2. Get new column name data type:
var columnType = "string"; 

// 3. Get the current report object:
var report = pivot.getReport(); 

// 4. Get the data object from the report:
var currentData = report.dataSource.data;

// 5. Add the new column to the meta object of currentData:
(currentData[0])[columnName] = {"type": columnType}; 

// 6. Update the report:
report.dataSource.data = currentData;

pivot.setReport(report);

 
 
2. Adding new record (row)
 
A new record can be added via the updateData() API call:

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

 
 
An important remark is that the newly created columns will apply pivot functionalities like format, filters, etc. by default.
 
 
3. Enabling edit-mode for columns/rows
 
This can be achieved by setting the editing parameter in the options object to true:

options: {
   editing: true
}

This way data can be edited in the drill-through pop-up window and in flat form for CSV, OCSV, and JSON data sources.
The user will be able to double-click the cell and enter a new value into it.
 
We have prepared a JSFiddle example for illustration.
 
 
Please let us know if everything works and if you have any questions.
 
We are looking forward to hearing from you.
 
 
Best Regards,
Vera