title: DataTables: Cannot read property style of undefined
body: <p>I am getting this error with the following:</p>
  
  <pre><code>jquery.dataTables.js:4089 Uncaught TypeError: Cannot read property 'style' of undefined(…)
  _fnCalculateColumnWidths @ jquery.dataTables.js:4089
  _fnInitialise @ jquery.dataTables.js:3216
  (anonymous function) @ jquery.dataTables.js:6457
  each @ jquery-2.0.2.min.js:4
  each @ jquery-2.0.2.min.js:4
  DataTable @ jquery.dataTables.js:5993
  $.fn.DataTable @ jquery.dataTables.js:14595
  (anonymous function) @ VM3329:1
  (anonymous function) @ VM3156:180
  l @ jquery-2.0.2.min.js:4
  fireWith @ jquery-2.0.2.min.js:4
  k @ jquery-2.0.2.min.js:6
  (anonymous function) @ jquery-2.0.2.min.js:6
  </code></pre>
  
  <p>The line above referring to     (anonymous function) @ VM3156:180 is:</p>
  
  <pre><code>                TASKLISTGRID = $("#TASK_LIST_GRID").DataTable({
                      data : response,
                      columns : columns.AdoptionTaskInfo.columns,
                      paging: true
                  });
  </code></pre>
  
  <p>So I am guessing this is where it is failing.</p>
  
  <p>The HTML ID element exist:</p>
  
  <pre><code>  &lt;table id="TASK_LIST_GRID" class="table table-striped table-bordered table-hover dataTable no-footer" width="100%" role="grid" aria-describedby="TASK_LIST_GRID_info"&gt;
    &lt;thead&gt;
      &lt;tr role="row"&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Solution&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Status&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Category&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Type&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Due Date&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Create Date&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Owner&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Comments&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Mnemonic&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Domain&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Approve&lt;/th&gt;
        &lt;th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1"&gt;Dismiss&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;&lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Also, the columns.AdoptionTaskInfo.columns &amp; response object arrays exist. Not sure how to debug what's wrong.. Any suggestions will be helpful..</p>