Question

Hi im trying to render datatables after intialisation and add a new row for a link

this is a part of my code an the “insert after” seems not to be working.

   $('#table thead tr').each(function() {
    nCloneTh.insertAfter(this.childNodes[5]);
});

can anybody help me? I want to insert the nCloneTh(th element) after my 5th column.

thx for help

my whole code looks like this

$(document).ready(function() {

var nCloneTh = document.createElement('th');
var nCloneTd = document.createElement('td');

nCloneTh.innerHTML = '<img src="style/img/icon_trash.png" id="imglink" title="Entfernen" class="center">';

$('#table thead tr').each(function() {
    nCloneTh.insertAfter(this.childNodes[5]);
});

$('#table tbody tr').each(function() {
    nCloneTd.insertAfter(this.childNodes[5]);
});

$('#table tfoot th').each(function() {
    nCloneTh.insertAfter(this.childNodes[5]);
});

dataTable = $('#table').dataTable({
    'bProcessing':true,
    'bServerSide':true,
    'sAjaxSource':'feedback.php',
    "oLanguage": {
        "sUrl": "language/dataTables.german.txt"
    },'aoColumnDefs':[{'bSearchable': false, 'bVisible':false, 'aTargets':[0]},
        {'bSortable': false, 'aTargets':[5]},
        { 'fnRender': function(o,val){return '<a>tss</a>';}, 'aTargets': [ 6]}
    ]
});

dataTable.fnClearTable( 0 );
dataTable.fnDraw(false);

});

Answer 1

Arrays are 0-indexed, so you’re trying to insert after the sixth <th> in your sample. Also, I noticed that nCloneTh is a DOM element, not a jQuery element. Try the following:

$('#table thead tr').each(function() {  
    $(nCloneTh).insertAfter($(this).children('th')[4]);
});