title: DataTables row details using parent columns for child row
body: <p>Is it possible to have the row details in DataTables show data below but aligned with the parent columns? I notice that when I use row details with <code>row.child( format(row.data()) ).show();</code> this will create another <code>&lt;tr&gt;</code> but then it will also add a <code>&lt;td colspan&gt;</code> which I do not want to happen.</p>
  
  <p>This is the row created when using <code>row.child()</code>:</p>
  
  <pre><code>&lt;tr&gt;&lt;td colspan="17"&gt;&lt;tr&gt;&lt;td&gt;&lt;/td&gt;&lt;td&gt;&lt;/td&gt;&lt;td&gt;January 12, 2016&lt;/td&gt;&lt;td&gt;Clientname&lt;/td&gt;&lt;td&gt;Projectname&lt;/td&gt;&lt;td&gt;Taskname&lt;/td&gt;&lt;/tr&gt;&lt;/td&gt;&lt;/tr&gt;
  </code></pre>
  
  <p>I also attached a picture below to show that I would like January 12, 2016 to line up with the parent Date column, the Clientname lined up with parent Client column and so on....</p>
  
  <p><a href="https://i.stack.imgur.com/egc9M.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/egc9M.png" alt="enter image description here"></a></p>
  
  <p>Anyone know a way to do this?</p>
  
  <p>Here is my current code for row details:</p>
  
  <pre><code>        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');
          }
  
  function format ( d ) {
      // `d` is the original data object for the row
          return  '&lt;tr&gt;'+
                              '&lt;td&gt;&lt;/td&gt;'+
                              '&lt;td&gt;&lt;/td&gt;'+
                              '&lt;td&gt;January 12, 2016&lt;/td&gt;'+
                              '&lt;td&gt;Clientname&lt;/td&gt;'+
                              '&lt;td&gt;Projectname&lt;/td&gt;'+
                              '&lt;td&gt;Taskname&lt;/td&gt;'+
                          '&lt;/tr&gt;';
      }
  </code></pre>