Adding a Row and then Deleting it

akreider

I want the user to be able to add a row to a table, and then delete it.

I give each row a html id, so that I can find its position and delete it. However, for rows that the user adds I don't know how to give them a html id. I'm using dataTable.fnAddData - and so far as I can tell, that only lets me specify the contents of each td cell in the row.

Is there a way I can do this?

Either I need to 1) add an html id to the row
or
2) find another way of getting the position (with fnGetPosition)
or
3) add the row, and then use jQuery to look for a row in the table that doesn't have a html id and add it with jQuery

Aaron

allan

Hi Aaron,

Good question! When fnAddData returns it passes back an array of integers which point to the location of the new row in DataTables internal row storage. So what you could do is something like:

[code]
var oSettings = oTable.fnSettings();
var aiNew = oTable.fnAddData[ 1, 2, 3 ];
var nNewTr = oSettings.aoData[ aiNew[0] ].nTr;
[/code]
Then the TR element that DataTables has created is available in nNewTr (this could easily be generalised with a loop to consider multiple rows added via fnAddData in a single call). For there, you can manipulate the id of the TR and any of the child elements as required.

Hope this helps,
Allan

akreider

Thanks, this solution worked great!

I set nNewTr.id to the id value that I wanted.

Aaron