title: How to use rowspan and colspan in tbody using datatable.js?
body: <p>Whenever I use <code>&lt;td colspan="x"&gt;&lt;/td&gt;</code>, I get the following error:</p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot set property '_DT_CellIndex' of undefined(…)</p>
  </blockquote>
  
  <h1>Demo</h1>
  
  <p><div class="snippet" data-lang="js" data-hide="true" data-console="true" data-babel="false">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$("table").DataTable({});</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.12/css/jquery.dataTables.min.css" rel="stylesheet"/&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.12/js/jquery.dataTables.min.js"&gt;&lt;/script&gt;
  
  &lt;table style="width:50%;"&gt;
    &lt;thead&gt;
      &lt;tr&gt;
        &lt;th&gt;1&lt;/th&gt;
        &lt;th&gt;2&lt;/th&gt;
        &lt;th&gt;3&lt;/th&gt;
        &lt;th&gt;4&lt;/th&gt;
        &lt;th&gt;5&lt;/th&gt;
        &lt;th&gt;6&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
      &lt;tr&gt;
        &lt;td&gt;1&lt;/td&gt;
        &lt;td&gt;2&lt;/td&gt;
        &lt;td&gt;3&lt;/td&gt;
        &lt;td&gt;4&lt;/td&gt;
        &lt;td&gt;5&lt;/td&gt;
        &lt;td&gt;6&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;td&gt;1&lt;/td&gt;
        &lt;td colspan="2"&gt;3 4&lt;/td&gt;
        &lt;td colspan="3"&gt;4 5 6&lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>It's working properly without DataTables.js, but when we use this structure with datatable.js it is not working. We need above table structure. Does anyone have any idea how we can use this table structure datatable.js?</p>