.row("#Id").data(row) on filtered lines breaks the row selector with hash (row("#" + Id))

esabora · June 2019

Hi,

I use a datatable with 10000 lines (clientside).
In order to have a good responsiveness, some lines are hidden using the $.fn.dataTableExt.afnFiltering method, and these line are shown per request.
It means that the html does not reflect the internal table (filtered lines are not in the DOM).
In order to access my data, I use the table.dataTable.row("#" + lineId) functionnality (I declared the rowId on my rows).

My problem is :
When I change the values of lines that are not shown in html (not in the DOM at all) like this :

var line = this.table.dataTable.row("#" + IdOld);
line.Id = IdNew;
this.table.dataTable.row("#" + IdOld).data(line);

If I want to access by the new Id like this :

var newLine = this.table.dataTable.row("#" + IdNew);

=> the result is undefined ! It looks like it is still internally linked to the old Id (this.table.dataTable.row("#" + IdOld);)

The strange thing is that if I access the row by the index, the data has been changed by new values, which is good. Only the row selector with hash is not working.

As I think the access to the row using the hash+Id is the easiest way to access my data, do you have a solution or a different way to make it work ?

.draw() or invalidate() are not working as they are linked to DOM.

Regards,

JG

allan · June 2019

Good question - I didn't expect the id's of a row to ever change, so the cache of the row ids (which is made to speed up the search for ids), isn't updated.

Why do you need to change the row id? Is it not unique per row?

Allan

esabora · June 2019

Hi, thanks for your answer.
I use the datatable as an editor (like excel).
Each time I add a row the internal Id is "-1", "-2", … and when it is saved in database then the Ids are changed by the database line Id, using the above code.
The Ids are still unique, but they can change …

allan · June 2019

I've just tried putting a little example together: http://live.datatables.net/nuzivire/1/edit . It appears to update the id as expected and can then be selected.

Could you modify that example to match what you are doing so I can see the issue?

Thanks,
Allan

esabora · June 2019

Hi Allan,

I think it works because the line which is updated is shown.
I'm using the $.fn.dataTableExt.afnFiltering method, and the lines which are shown are ok (updated and accessible with the #Id), but the lines which are hidden are not (updated but NOT accessible with #Id).
I don't know how to modify your example to implement this filtering method, but if you know how to do this, I'm pretty sure it will show you the problem.
Best regards,
JG

allan · June 2019

It still appears to work as expected: http://live.datatables.net/nuzivire/2/edit .

Allan

esabora · June 2019

Hi Allan,

I've modified your code to show you my problem

http://live.datatables.net/nuzivire/5/edit

Thank you,

Regards,

JG

kthorngren · June 2019

I found a couple issues in your example. You have rowId: 'id' but are using line.Id = 100;. Its case sensitive so you need line.id.

I'm guessing you are trying to change the row data using this table.row("#-10", line);. To do so you need to use the data() API like this: table.row("#-10").data(line);. Here is your updated example:
http://live.datatables.net/wofamazi/1/edit

Kevin

esabora · June 2019

Hi,
Thanks Kevin for your feedback.
Yes I've seen these mistakes once I put the link, so yes you're right it is working as expected with this but … this is not the case in my program.
It's quite difficult to reproduce exactly my code, so I'm working again on a sample.
I'll come back with a -non- working case

esabora · June 2019

Still working on the problem ...

kthorngren · June 2019

You need to use draw() for Datatables to perform any sorting or searching of the updated table. For example:
http://live.datatables.net/qeborezo/1/edit

Since you are bulk updating in as loop you want to make sure to use draw only once after the loop.

Kevin

esabora · June 2019

I think I managed to reproduce …

http://live.datatables.net/nuzivire/7/edit

If you have the "SetData Modified" message in the console then it means that I didin't manage to access the line through the # + Id.

It happens only when adding rows like this : "table.rows.add(rowsToAdd)", where as it doesn't happen when adding row one by one. In fact I can access the first line, not the second. The only difference is that the second one is hidden through the filter.

What do you think ?

Regards,

JG

kthorngren · June 2019

Your example generates this error:

DataTables warning: table id=example - Requested unknown parameter 'a' for row 101, column 0. For more information about this error, please see http://datatables.net/tn/4

The reason is the data structure you are building with this:

  // Add a hidden line
    rowsToAdd.push([{
    a: 1,
    id: -2,      
    b: 2,
    c: 3,
    d: 5,
    order: 32,
    HiddenLine: true
  }]);

You are encapsulating the data object in an array then pushing that onto an array so it looks like this:

[
  [
    { a:1, id: -2, ...}
  ],
  [
    { a:1, id: -2, ...}
  ]
....
]

Remove the [] from the push() method and it looks like it works:
http://live.datatables.net/yeviyiza/1/edit

Kevin

esabora · June 2019

Kevin, you're right (however I didn't have the datatable warning in the console).
I'm checking if this is the problem in my code or if my example was (again) not reflecting exactly my code …
Regards,
JG

esabora · June 2019

New example with strange behaviour :

http://live.datatables.net/nuzivire/7/edit

Even if I go through the entire table (at the end of the code) to re-order all the lines not all of them are re-order. (on the right, the column order is not good for the 4 first lines).
I Believe this has to do with the duplication of the line :
var duplicateLine = table.row("#1").data();
I think that it is pointing to the line, not duplicating it.

If I change that line by :
var duplicateLine = $.extend(true, {}, table.row("#1").data());

The re-order seems to work for all the lines.

Are you agree with this or am I (again) wrong ?

I think my problem is like to this as I do some Copy/paste of the line when I have my initial problem accessing the lines by the #Id.

Regards,

JG

kthorngren · June 2019

Thats an interesting problem. If I change the initial order to be column 5 then the order of column 4 is affected. If I add table.draw() after the first rows.add() then column 5 is sorted correctly but not column 4. See the updated example:
http://live.datatables.net/nuzivire/9/edit

This is one for @allan or @colin to look at.

Kevin

colin · June 2019

Hi all,

The problem is the use of rowId, if you comment it out, everything works as expected. As it says on that page,

they cannot start with a digit, two hyphens, or a hyphen followed by a digit.

the negative symbol is a hyphen, so this is what's breaking it. You need to form a different naming structure for those IDs.

Cheers,

Colin

esabora · June 2019

..

esabora · June 2019

Colin,
Even if I use non-negative Ids, it doesn't work as expected.
JG

colin · June 2019

OK, could you update your test page to demonstrate the issue, please?

esabora · June 2019

Colin,

Here is the updated example :

http://live.datatables.net/pisarisa/4/edit

As you can see, even when using positives Ids the re-order at the end is not taking all the lines, which I Believe is not what it should do.

It is not re-ordering line with order = 1, 2, 31 & 32.
These lines are ::
- lines 1 & 2 : orignal lines, which has been duplicated.
- lines 31 & 32 : first duplication of 1 & 2
- lines 6000 & 8000 : second duplication of lines 1&2, but these ones have been re orered.

Regards,

JG

colin · June 2019

Hi @esabora ,

Got it, that was an odd one.

Because you're using objects for the data source, when you call row().data(), you're getting the actual data source for that row - which you were then copying and modifying, but this would also change the original.

If you do a full copy like this,

JSON.parse(JSON.stringify(table.row().data()));

then everything works as expected, see here.

Cheers,

Colin

esabora · June 2019

Hi Colin,
Sorry for the delay I'm quite busy at the moment and I couldn't find time to test that.
I'll do that as soon as I can, and I'll come back to you.
Thanks a lot for your help

.row("#Id").data(row) on filtered lines breaks the row selector with hash (row("#" + Id))

.row("#Id").data(row) on filtered lines breaks the row selector with hash (row("#" + Id))

Answers

Howdy, Stranger!

Categories

DataTables

.row("#Id").data(row) on filtered lines breaks the row selector with hash (row("#" + Id))

.row("#Id").data(row) on filtered lines breaks the row selector with hash (row("#" + Id))

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables