Datatables Responsive always hidden column regardless of viewport

Question

I have a generic DataTable with Responsive successfully configured. What I am after is to force DataTable to have a hidden column no matter what viewport it is displayed.

I tried searching for anything that might help me here but no luck.

Answer 1

Found what I am trying to achieve. You gotta add class="none" to the header of column you intend to always hide.

<table id="example" class="display" width="100%">
    <thead>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th class="none">Age</th>
            <th class="none">Start date</th>
            <th>Salary</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>61</td>
            <td>2011/04/25</td>
            <td>$320,800</td>
        </tr>
        <tr>
            <td>Garrett Winters</td>
            <td>Accountant</td>
            <td>Tokyo</td>
            <td>63</td>
            <td>2011/07/25</td>
            <td>$170,750</td>
        </tr>
    </tbody>
</table>

Then simply initialize datatable with the Responsive plugin

$(document).ready(function() {
  $('#example').DataTable();
});