fnAddData which is a TR html string. Persist TR attributes on the new row.

fnAddData which is a TR html string. Persist TR attributes on the new row.

oktav2k3oktav2k3 Posts: 6Questions: 0Answers: 0
edited May 2013 in General
Hello,

I'm using fnAddData to add data to a datatable after initialization.

[code]
oTable.fnAddData $(data).children("td").map ->
$(this).html()
[/code]

The data object is an html string received through an ajax post request. The html string is actually a full table row, so in order to add it I need to get the TD's out of the string. Once I do that, I lose all info regarding the TR tag and apparently I have no way of setting the attributes on the newly created row.

Is there a way to do this through the API (like a fnAddData callback which yields a ref to the new row) or do I need to get the old TR attributes from the html string and then find the new row, and change them with something like $(new-row).data("myattr", myval) ?

If it's not possible, then this could be a nice new feature:

[code]
oTable.fnAddData data
[/code]

where data is a TR with attributes and data tags and lots of TD children. The TR attributes and data tags will persist when creating the new row through the datatables API.

EDIT:

Apparently there is a bigger issue. The TD elements will not persist their attributes as well. I managed to fix the TR with:

[code]
rowAttributes = $(data).data()
index = oTable.fnAddData $(data).children("td").map ->
$(this).html()
$(oTable.fnGetNodes(index)).data(rowAttributes)
[/code]

but the issue with the TD's is complicating things even more

EDIT 2:

Last update. Apparently the easiest way (that I found) to insert a TR with data attributes and TD children (with data attributes) is to destroy the datatable and re-initialize. Here's the code:

[code]
# Destroy the table
oTable.fnDestroy()

# Append new row as simple HTML
$("#my-table tbody").append($(data))

# Re-Initialize the table with the same initial options
oTable.dataTable
bPaginate: false
bLengthChange: false
aaSortingFixed: [[8,'asc']]
aoColumnDefs: [
bVisible: false
aTargets: [8]
]
[/code]

EDIT 3:

Turns out fnAddTr should do just what I need. Unfortunately it doesn't work with hidden columns so I adapted it slightly with this little piece of code:

[code]
...
nTr._DT_RowIndex = iIndex

$.each oSettings.aoColumns, (i, v) ->
nTr.removeChild(nTr.getElementsByTagName('td').item(i)) unless v.bVisible
...
[/code]

I'm using jQuery and coffeescript. Hope this is readable.

In the html I just used:

[code]
oTable.fnAddTr $(data).get(0)
[/code]

which is waaay better than what I was doing before.

Hope this helps someone else.

Thanks
This discussion has been closed.