title: Datatables add multiple child-rows
body: <p>I have a table hooked up to the jQuery datatable. Based on this <a href="http://www.datatables.net/examples/api/row_details.html" rel="noreferrer">example</a> I want to add "hidden" child rows to show extra information. </p>
  
  <p>I have the following <a href="http://jsfiddle.net/dvgotLfz/1/" rel="noreferrer">jsfiddle</a> where I have a name/value pair. </p>
  
  <pre><code>&lt;tr data-child-name="Name1" data-child-value="Value 1"&gt;
      &lt;td class="details-control"&gt;&lt;/td&gt;
  </code></pre>
  
  <pre class="lang-js prettyprint-override"><code>function format ( name, value ) {
      return '&lt;div&gt;' + name + ': '+ value + '&lt;/div&gt;';
  }
  
  $(document).ready(function () {
      var table = $('#example').DataTable({});
  
      // Add event listener for opening and closing details
      $('#example').on('click', 'td.details-control', function () {
          var tr = $(this).closest('tr');
          var row = table.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(tr.data('child-name'), tr.data('child-value') )).show();
              tr.addClass('shown');
          }
      });
  });
  </code></pre>
  
  <p>My question is how do I add more than one name/value pair? So that I can define various rows like in the datatables.net example.</p>
  
  <p>My source is a php-script that generates html like in the jsfiddle example.</p>
  
  <p>It's probably an easy task but my jQuery skills are very limited :-)</p>
  
  <p>Thank you.</p>
  
  <p><strong>UPDATE</strong>:
  The data comes from an ldap query:</p>
  
  <pre><code>$ldapResults[$i]
  echo "&lt;td&gt;" . utf8_encode($ldapResults[$i]['sn'][0]) . "&lt;/td&gt;"
  </code></pre>