Datatable row.add([]) passing a jquery dom?

Question

I am using dataTable and need to add a jquery dom to one column. The following is my code:

var markup = $("<a></a>").addClass("ClassName")
            .attr({ href : "Something.html",title : "Edit"});

var t = $("#myTable").DataTable();

t.row.add( [markup] ).draw( false );

The above code displays "[object Object]" in the column instead of the required href.

here is my table structure:

<table id="myTable" >
 <tbody> 
 </tbody>
 </table>

What am I doing wrong here?

Answer 1

You are passing jquery object, try passing javascript object like this

t.row.add( [markup[0]] ).draw( false );

Because row.add description says this for dom objects

Data to use for the new row. This may be an array, object, Javascript object instance or a tr element.

Specially this part

Javascript object

Update

I tried in all the way possible but it is not working in any way, seems a bug in DataTables , but there is a workaround that you can use, try adding your markup like this

t.row.add([markup.wrap('div').parent().html()]).draw(false);

or just put direct markup, like this

t.row.add(['<a class="ClassName" href="Something.html" title="Edit">Edit</a>']).draw(false);

Fiddle Example