Create new row with nasted tables with AJAX Request

mrseefeld

Hi,

I'm trying to create similar functionality to this one: http://www.datatables.net/release-datatables/examples/api/row_details.html

The only major difference to my code is that I'm trying to get the data through AJAX, and it does not work!
The AJAX request it self is made successfuly and I can see the HTML code inside the response.

My JS Code:

[code]
/* Creata TableData
--------------------------------------------*/
function fnFormatDetails ( StreetVal, oTable, nTr )
{
var sOut = $.ajax({
url: "ajax.php",
data: StreetVal,
success: function(data) {

console.log(data);
return data;

}
});

return sOut;
}

$(document).ready( function(){


$('.table-data tbody tr td a').addClass('closed');

var oTable = $('.table-data').dataTable({
"sPaginationType": "full_numbers",
"bStateSave": false,
"bRetrieve": true
});

$('.table-data tbody tr td a').live('click', function (event) {

var StreetVal = $(this).attr('href').split('#')[1];
var nTr = this.parentNode.parentNode;

if( $(this).hasClass('closed') ) {

$(this).removeClass('closed').addClass('open').html(' - ');
oTable.fnOpen( nTr, fnFormatDetails( StreetVal, oTable, nTr ), 'details' );

} else {

$(this).removeClass('open').addClass('closed').html(' + ');
oTable.fnClose( nTr );
}

return false;


});

});[/code]


Live example here: http://www.webiq.co/test/jQuery%20DataTables%20with%20hidden%20rows/

The problem is that it is throuing an error: [code]Could not convert JavaScript argument arg 0 [nsIDOMHTMLTableCellElement.appendChild]
[Break On This Error] nNewCell.appendChild( mHtml ); [/code] at line 1776 of jquery.dataTables.js / v. 1.8.3.dev

What is the problem?
Any suggestion much appreciated.