0

I have some issues with a project I inherited that is using DataTables and it's filter functionality.

The issue is that in the main function which populates the table, it has the following code:

var rowPos = mainTable.fnAddData(tableData, false)[0];
var rowData = mainTable.fnSettings().aoData[rowPos];

$(rowData.nTr).attr("id", "UID" + id); // Since the id doesn't always match the row

rowData.ID = id;

Now I know that the 3rd line is pretty much useless unless the 'false' argument of the fnAddData is set to 'true'. This is because the HTML elements don't actually exist in the DOM when set to 'false' so there is no way of setting the 'id' attribute.

I can't use 'true' because it will render the table in about 4 seconds when adding several hundred rows to the table. But when I use 'false' it renders the table almost instantaneously (less than a second). So using the 'true' flag in 'fnAddData()' is not even an option.

I see the last line seems to be doing something, but I've tried to find documentation for that on the DataTables web site but can't seem to find anything of value. I'm assuming it allows someone to bind a UID (unique record ID) to the actual row number, which is essential what is wanted.

The code I have also makes use of the 'fnRowCallback', which tries to set the 'id' attribute at this time, such as:

var id = mainTable.fnSettings().aoData[tablePos].ID;
$(row).attr("id", "UID" + id); // Since the id doesn't always match the row

The main problem is that it does not seem to work! If I apply a table filter and purposely filter out all records except the record which should be 'UID' 3, in the 'fnRowCallback', my 'id' variable is set to 0. So the attribute set is always 'UID0' and causes all sorts of bad references.

Is there a way to properly assign my database record ID to table row's? And then refer them later on, such as in the 'fnRowCallback' function? Or is there some other trick someone has managed to figure out?

Thanks in advance for your time and responses!

Update: 2012.11.01 12:33 - I've added an answer below based on various findings so far!

Jeach
  • 8,656
  • 7
  • 45
  • 58

1 Answers1

0

I've been doing a bit of digging and here are my conclusions so far...

Using a JavaScript object inspection that I found on this SO page (by 'goreSplatter') I was able to dump various DataTables objects.

I realized that my 'rowData' object was a tiny container, as expected. And realized that the 'rowData.ID' property did not originally exist in this data structure. I guess the application developer inserted it himself and it makes sense.

From the 'fnRowCallback()' function, I did the same object inspection to try and find the initial 'rowData' that I initialized my 'ID' on. I found it as follows:

var rowData = mainTable.fnSettings().aoData[tablePos];

And when I dump the value of 'rowData.ID' I realized that my 'ID' value was properly set as expected.

The problem occurs when I do my filter! The 'rowData.ID' seems to always be '0' for some reason. It seems like the DataTables takes a copy of the object but does not set any properties it does not know and thus results in '0'.

So it is definitely a bug (at least, in my opinion)! I will contact the DataTables people to see how they would expect users to bind custom application data to their rows and see if they can also set these properties during a filtering process.

I will report any further findings later on.

Community
  • 1
  • 1
Jeach
  • 8,656
  • 7
  • 45
  • 58