Our blazing fast Grid component built with pure JavaScript


Post by bensullivan »

Hi

What's the easiest way to check that a grid has changed ie, a cell has changed (dropdown column, percent column) or a row has been added or a column has been added?

At the moment I'm using
(this.gridEngine.store as Store).records.filter(pa => pa.isModified).length !== 0
but it doesn't seem to be picking up all of the above cases...

Is there an API method that will give me what I'm after?

Thanks!

Ben

Post by mats »


Post by sergey.maltsev »

Hi!

We have events for all changes made to grid.
https://www.bryntum.com/docs/grid/#Common/mixin/Events

So you could listen to changes and perform any actions you need or toggle your local isChanged flag.

For column changes you could listen to change event at columns.
https://www.bryntum.com/docs/grid/#Grid/data/ColumnStore#event-change

For row changes you could listen to change event at store.
https://www.bryntum.com/docs/grid/#Common/data/Store#event-change

For example.
// Row change,  Column sort and grouping
grid.store.on({
    change : ({ action, records: columns }) => {
        console.log(`Row change : ${action} ${JSON.stringify(columns)}`);
    },
    sort : ({ sorters }) => {
        console.log(`Sort : ${JSON.stringify(sorters)}`);
    },
    group : ({ groupers }) => {
        console.log(`Group : ${JSON.stringify(groupers)}`);
    }
});

// Column add/remove/hide/update/reorder etc.
grid.columns.on({
    change : ({ action, records: columns }) => {
        console.log(`Columns change : ${action} ${JSON.stringify(columns)}`);
    }
});

Post Reply