asked on March 30, 2021
Context
Using angular and flexmonster I am able to set the data
this.pivot?.flexmonster.connectTo({ data: this.data });
this.pivot.flexmonster.setReport(this.report)
Then update the data:
this.pivot.flexmonster.updateData({data: [newItem]}, {partial: true});
The update works perfectly.
My Requirements:
When a value is updated in the grid I want to add a css class to that cell to make it flash.
Failing that, get hold of the row and make that flash.
My Problem:
I've looked at all your events but I can't seem to get a reference to the updated cell or row to set my class.
⋅ March 31, 2021
Hello,
Thank you for reaching out.
We have prepared the JSFiddle to demonstrate sample implementation: https://jsfiddle.net/flexmonster/0smc8Lz3/.
You can see the detailed explanation of the used approach below:
Every time you update the data, execute the adjustStyling function after the update and pass the changed records as a parameter:
function editRecords() {
const dataForUpdate = [...]
flexmonster.updateData({ data: dataForUpdate }, { partial: true });
adjustStyling(dataForUpdate);
}
The function itself will retrieve all the updated records. Next, it will use the customizeCell API call to iterate over cells of the grid and complement changed cells with a CSS class:
function adjustStyling(dataForUpdate) {
let updatedId = dataForUpdate.reduce((accum, record) => { //retrieve all identifiers
accum.push(record.RowId);
return accum;
}, []);
flexmonster.customizeCell((cell, data) => {
if (data.type != "value" || !data.recordId) return; //filter out headers and cells without recordId
if (!data.recordId.some((id) => { //checks, if the recordId array includes at least one of the changed identifiers
return updatedId.includes(id);
})) return;
cell.addClass("updated"); //adds the class
});
}
Please let us know if it works for you.
We are looking forward to hearing your feedback.
Regards,
Illia
⋅ March 31, 2021
Hi Illia,
Integrated your example into my App. Works perfectly!
Thanks for the quick response and detailed answer.
Regards,
Marc