Update table on data change from variable

mrnns

I'm trying to update a table whenever the data variable source changes (array of objects). The solution I found was to clear all the rows and add all rows again, but my table is big enough to slow the page, so I don't think that redrawing the table is the solution.

What would be a good approach? Thanks

kthorngren

Maybe a date range search filter will work. See this example. You can replace the plugin used in the example with this date range plugin.

Kevin

mrnns

I think you didn't understand me or I didnt explain myself.

If I have a row like this:

Sensor 1 Temperature: 20C

And temperature changes, I want to update that cell, but without refreshing the whole table. Its a simple example of my problem.

kthorngren

Sorry I misread the question - I need my glasses. I thought your post had the word date

And temperature changes,

If the data contains an id or some sort of unique data then you can find the row to be updated. See the row-selector option for options.

I want to update that cell

Once you have a way to find the row you can use that selector with cell().data() to update the specific cell.

Kevin

mrnns

Haha. Don't worry. I was doing that, but I needed a copy of the array of objects, for example, for a row, a copy of that object. If I use the original data as source in the datatable, and I want to comparte the current data in the table with the new data, the data from the table is updated (but not represented)

allan

Just to confirm - are you happy you have a solution now (I'm not clear on that from your last message)? To get the object that DataTables has for a row, use row().data().

Allan

mrnns

If my data source is not a copy, every time I get the row data, it its updated (but the table is not reflecting the updated information). For example. I have a data object like this {sensor:1, temperature: 20}, after a few seconds that object is {sensor: 1, temperature: 25}. If that object is the data source of the table, if I use row().data(), I'll get the newest, but the table still showing the first one (temp: 20). So, what I do is copies so I can check if there was an update to pass to that row the new data

kthorngren

Please post the code you are using do the updates.

Kevin

kthorngren

Here is a simple example of what I explained earlier:
http://live.datatables.net/penolori/1/edit

Kevin

mrnns

What I'm doing its something like this: live.datatables.net/penolori/2/edit

I update the data source variable, but the table isn't updated, so if I make a function that checks the data agains the table data, it will always be the same. Only if I make a copy of that data I can check if it has been updated and then set data and draw.

kthorngren

You actually need to update the Datatable. Datatables keeps a data cache of all the data. Updating the source object doesn't update the Datatables data cache. You can either use the technique I showed to update specific cells. Or you can use clear() to clear the table and re-add the rows using rows.add(). Like this:
http://live.datatables.net/hubuquze/1/edit

Kevin

allan

Yup - you need to tell DataTables that the data has changed - you can do that with the rows().invalidate() method: http://live.datatables.net/honinuyo/3/edit .

If you know which row was edited (i.e. an id) then you can use row().invalidate() which will be faster for large data sets: http://live.datatables.net/honinuyo/2/edit

This is required because DataTables doesn't "observe" the source objects - it doesn't know that the data has changed.

Allan

kthorngren

Learn something new every day. Didn't realize rows().invalidate() would work this way

Kevin

mrnns

Thanks! I think it's a good solution, I want to try if I can do rows().invalidate() to the whole table without lacking performance.

allan

It is actually one of my favourite methods that one - a bit underused, but every time I have a use for it, I like it

Allan

mrnns

I tried to update the data like this in my Angular project and it doesn't update the table
Only when I change all data.

kthorngren

Can you post a link to your page or a test case replicating the issue so we can help debug?
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin