Title: jQuery Datatables strangely wraps the child row content with "<tr>"
Tags: jquery;datatables
Question: Ok so here’s the thing . I’m using jQuery datatable grid with child rows and everything is working fine. The only problem is that when the “.child()” method is called like this “row.child(format(row.data())).show();” it renders a simple paragraph and puts it into the child row(that’s fine), but it also wraps the paragraph in a strange
“<tr&gt;<td colpspan=”4”&gt;</td&gt;</tr&gt;”
which is not desired and it’s not created by my code. It’s probably a part of the “.child()” method itself and I can’t figure out how to manipulate it . The question is : How can I prevent the paragraph(or any content) rendered by “.format()” method being wrapped in “<tr&gt;<td colpspan=”4”&gt;</td&gt;</tr&gt;”
Here is the code :
function format (d) {
return '<p class="custom_paragraph"&gt;ok</p&gt;';
// Add event listener for opening and closing details
$('#gridEntities1 tbody').on('click', 'td.details-control', function(){
var tr = $(this).closest('tr');
var row = entities_grid.row(tr);
if(row.child.isShown()){
// This row is already open - close it
row.child.hide();
tr.removeClass('shown');
}
else{
// Open this row
row.child(format(row.data())).show();
tr.addClass('shown');
}
});
Comment: You can only have `` elements as the direct children of ``. Datatables is taking care of this for you. You still have complete control over how this child row is styled. This extra markup is necessary.

Comment: It is `` not colpspan, and it is how it works. It gives you the ability to have some child content in the full width of the table.

Here is the accepted answer: Ok , that may not be the proper solution for this, but it worked for me as workaround. I just removed the margin and padding around the paragraph like this :
$('.custom_paragraph').closest('td').css({'margin': '0', 'padding': '0'});


{'source': 'StackExchangeDataset', 'subset': 'stackoverflow.com', 'metadata': {'AnswerCount': 1, 'CommentCount': 2, 'ContentLicense': 'CC BY-SA 3.0', 'CreationDate': '2017:00:05/17/17', 'FavoriteCount': None, 'PostTypeId': 1, 'Tags': '<jquery><datatables>', 'Title': 'jQuery Datatables strangely wraps the child row content with "<tr>"', 'ViewCount': 305, 'id': 44018741, 'user_AboutMe': '', 'user_AccountId': 3729393.0, 'user_DisplayName': 'user3102290', 'user_Reputation': 125.0, 'user_Views': 12.0, 'user_id': 3102290.0}}