Our blazing fast Grid component built with pure JavaScript


Post by Yamo1993 »

Is it possible to get the currently checked checkboxes by accessing the CheckColumn? I have some other UI component (not Bryntum-related) which performs bulk operations on the checked rows in the Bryntum grid.

How can I get the checked checkboxes from the CheckColumn? Right now, I am traversing the entire grid store with Bryntum's traverse() method to find if there are checked checkboxes. It doesn't feel like an optimal way performance-wise.

I was assuming that maybe Bryntum is already keeping track of a set of checked checkboxes. But I couldn't find anything in the docs about it. Do I need to keep track of it myself?


Post by Animal »

Traversing the store is the way. You are processing data, correct?

The actual DOM only represents 20 or so rows of data since it is minimally rendered for fast performance.

A row takes on the values from the record when the record is scrolled into view and if any editing is done, the data is updated immediately.

When a row scrolls out of view, it is reused by another record coming into view.

The data should be the only source of data.


Post by Yamo1993 »

Interesting. Then I guess I can keep the store traversal as-is, thanks! :)

The grid is very performant I have to say. Very impressive. Nice to know about how it works internally.

Thanks for clarifying that. I also felt that introducing a new set which tracks Bryntum data is the wrong way to go and can cause bugs if the two datasets get out of sync. The source should always be the Bryntum store itself, got it. Thanks again.


Post by Animal »

Cool!

In case you hadn't seen the exact method, It's a simple query call on the Store. You can try it in this example: https://bryntum.com/examples/gantt/inactive-tasks/

Do this in the debugger console: gantt.taskStore.query(t => t.inactive).map(t => t.name)

Screenshot 2021-11-22 at 18.03.37.png
Screenshot 2021-11-22 at 18.03.37.png (138.63 KiB) Viewed 610 times

Post by Yamo1993 »

Thanks. My question was about the Grid and not the Gantt though, but it worked with grid.store.query() too :)


Post by Animal »

One of the great things about the Bryntum products is that they all build on a common foundation.

The data part (Stores and Models) are common to all products.

And Schedulers and Gants are both Bryntum Grids, with a special SubGrid to contain the events and extra complexity.

You could feed the same EventStore into a Grid, a Scheduler, a Gantt, a Calendar or a TaskBoard. You just get different views of the data.


Post by Yamo1993 »

Thanks Animal :)


Post Reply