title: jQuery dataTable error Cannot read property 'mData' of undefined
body: <p>I have following dataTable  which has 6 columns. </p>
  
  <p>After rendering the table I am initializing <code>.DataTable()</code>. But getting the error:</p>
  
  <blockquote>
    <p>'mData' of undefined TypeError: Cannot read property 'mData' of undefined</p>
  </blockquote>
  
  <p>As mentioned in few of the posts , I have added tfoot but still have the error.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function() {
      $('#pTable').DataTable();
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/&gt;
  
  &lt;script src="https://code.jquery.com/jquery-3.3.1.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"&gt;&lt;/script&gt;
  
  &lt;table id="pTable" class="display" style="width:100%"&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;Status&lt;/th&gt;
              &lt;th&gt;Name&lt;/th&gt;
              &lt;th&gt;NOK&lt;/th&gt;
              &lt;th&gt;Phone&lt;/th&gt;
              &lt;th&gt;IsEnabled&lt;/th&gt;
              &lt;th&gt;Add/Edit&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
          &lt;tr&gt;
              &lt;td class="text-muted" data-bind="text: ID, visible: false" style="display: none;"&gt;288f60e3-0d8f-4a4a-92f9-4f4eeb737909&lt;/td&gt;
              &lt;td&gt;&lt;span class="label label-accent"&gt;Active&lt;/span&gt;&lt;/td&gt;
              &lt;td class="text-muted" data-bind="text: NAME"&gt;Buddy1&lt;/td&gt;
              &lt;td class="text-muted" data-bind="text: NOK"&gt;SomeOne&lt;/td&gt;
              &lt;td class="text-muted" data-bind="text: SYMPTOMS"&gt;12354475541&lt;/td&gt;
              &lt;td class="text-muted"&gt;
                  &lt;div class="pretty p-round p-fill p-icon"&gt;
                      &lt;input type="checkbox" data-bind="value: ISENABLED, checked: ISENABLED, event: { change: $parent.togglePatients}" value="true"&gt;
                      &lt;div class="state p-primary"&gt;
                          &lt;i class="icon fa fa-check"&gt;&lt;/i&gt;
                          &lt;label data-bind="text: ISENABLED"&gt;true&lt;/label&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
              &lt;td class="text-muted"&gt;
                  &lt;div class="btn-group pull-right"&gt;
                      &lt;button data-bind="click: $parent.showPatients" type="button" class="btn btn-default btn-xs" data-toggle="modal" data-target="#PatientsModal"&gt;
                                                      &lt;i class="fa fa-edit"&gt;&lt;/i&gt; Edit
                                                  &lt;/button&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
  
              &lt;td class="text-muted" data-bind="text: ID, visible: false" style="display: none;"&gt;ae2dc252-4940-455e-a528-766f3d7d8fe9&lt;/td&gt;
              &lt;td&gt;&lt;span class="label label-accent"&gt;Active&lt;/span&gt;&lt;/td&gt;
              &lt;td class="text-muted" data-bind="text: NAME"&gt;Buddy2&lt;/td&gt;
              &lt;td class="text-muted" data-bind="text: NOK"&gt;SomeOne Else&lt;/td&gt;
              &lt;td class="text-muted" data-bind="text: SYMPTOMS"&gt;0564654654734&lt;/td&gt;
              &lt;td class="text-muted"&gt;
                  &lt;div class="pretty p-round p-fill p-icon"&gt;
                      &lt;input type="checkbox" data-bind="value: ISENABLED, checked: ISENABLED, event: { change: $parent.togglePatients}" value="false"&gt;
                      &lt;div class="state p-primary"&gt;
                          &lt;i class="icon fa fa-check"&gt;&lt;/i&gt;
                          &lt;label data-bind="text: ISENABLED"&gt;false&lt;/label&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
              &lt;td class="text-muted"&gt;
                  &lt;div class="btn-group pull-right"&gt;
                      &lt;button data-bind="click: $parent.showPatients" type="button" class="btn btn-default btn-xs" data-toggle="modal" data-target="#PatientsModal"&gt;
                                                      &lt;i class="fa fa-edit"&gt;&lt;/i&gt; Edit
                                                  &lt;/button&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
  
          &lt;/tr&gt;
  
      &lt;/tbody&gt;
      &lt;tfoot&gt;
          &lt;tr&gt;
              &lt;th&gt;Status&lt;/th&gt;
              &lt;th&gt;Name&lt;/th&gt;
              &lt;th&gt;Patients&lt;/th&gt;
              &lt;th&gt;Phone&lt;/th&gt;
              &lt;th&gt;IsEnabled&lt;/th&gt;
              &lt;th&gt;Add/Edit&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/tfoot&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>