Update a single row

thijxx

I have some code in Python3 and use Socket-IO to update a dataset on the client side. There I draw a table and it this all works fine. But now I'd like to update a single row when new data for the row comes in.
For this I tried to use the search() on column() with column ID's and column names. But when I use search the result is always an array of methods (?) and not just a single row or 'cannot find the row'.
I have been reading the docs for a couple of hours and I expect it to be a selector that I can use with draw() to update the selected row.

This is my table:

        var gastentabel = $('#example').DataTable( {
            data: dataset,
            columns: [
                { "name": "Name" },
                { "name": "Age" },
                { "name": "Drink" },
                { "name": "Glass" },
                { "name": "DrinkCounter"}
            ]
        });

Then when new data comes in:

        socket.on('gastupdate', function (data) {
          // data[0] 'John' is updated here with a whole new set for John
          gastenlijst[data[0]] = data;

          // here I go from the dict to an array for datatables
          dataset = [];
          for (var key in gastenlijst) {
            dataset.push(gastenlijst[key]);
          }

          // gastenlijst.column('Name').search(data[0]).draw; // I try to make this work
          gastentabel.clear().rows.add(dataset).draw(); // this works fine
        });

What I expect is that when I do this, the data[0] contains the Name of the new data coming in, it matches the Name in data[0] with a cell in column Name and then does draw() of the row(s) returned:

gastenlijst.column('Name').search(data[0]).draw;

colin

Hi @thijxx ,

gastenlijst.column('Name').search(data[0]).draw();

will only show the matching record for that table. It sounds like you want to use filter() to find the specific row, then to update it with row().data().

If that doesn't help, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

thijxx

Thank you @colin for your reply. My apologies for the infringement on the forum rules.

I tried to provide a solid test case here: http://live.datatables.net/cohupane/3/edit?html,css,js,console,output

kthorngren

Thanks for the example!

I updated your example here:
http://live.datatables.net/hakomate/1/edit

Its not intuitive how to use filter() to get the desired row(s). The examples show how to get the actual data. But you will want to get the row indexes using rows().indexes(). In your case you are interested in only one row with the filter working on a column with unique data, I'm assuming.

I updated the example to have three rows with two having the name John. Just to highlight only one row being changed. There are some comments which hopefully help explain what the code is doing.

Kevin

thijxx

Thank you for your help @kthorngren , I will study the example and give it a try in my actual code. It may take some time for me to get to this but I will report back afterwards.

thijxx

Thanks again, I've tested the code and I think it works great.
Below is the mechanism I use for determining if a row is new or not. Is this a good way to do it or is there a better way to look at the response of .indexes() to determine if a row is new or existing? I find the response of the indexes method a bit hard to interpret.

      var indexes = gastentabel
              .rows()
              .indexes()
              .filter(function (value, index) {
                return data[0] === gastentabel.row(value).data()[0];
              });

      if (typeof indexes[0] === "number") {
        gastentabel.row(indexes[0]).data(data).draw();
      } else {
        gastentabel.row.add(data).draw();
      }

kthorngren

I find the response of the indexes method a bit hard to interpret.

I suspect that is due to filter() (and indexes()) returning an API instance not just a Javascript array. You can use toArray() to just get an array, for example:
http://live.datatables.net/monohomo/1/edit

Kevin

thijxx

@kthorngren amazing, thank you!