Showing 1 – 2 of 2 replies
ajm

How to show specific columns in […]

ajm PURCHASED
7 years ago
Hi, how to show specific columns in responsive datatable and hide others for mobile view?

The below code do the work, but it's I can't choose which column should be viewed...
responsive: true
SeanTheme
SeanTheme SELLER
7 years ago
Hi Ajm,

DataTable responsive plugin can use the css class to show / hide the table column. Here is some example
<thead>
<tr>
<th class="all">Name</th>
<th class="min-phone-l">Position</th>
<th class="min-tablet">Office</th>
<th class="never">Start date</th>
<th class="desktop">Salary</th>
<th class="none">Extn.</th>
</tr>
</thead>

For more information, you may refer to the following link about hiding or showing the column in tablet / mobile view.
https://datatables.net/extensions/responsive/examples/display-control/classes.html

Best Regards,
Sean.
ajm
ajm PURCHASED
7 years ago
Hi Sean,

Thanks, I have fixed this with following classes

<tr class="purple">
<th class="col-sm-4 visible-phone">Staff</th>
<th class="col-sm-3 visible-desktop hidden-phone visible-tablet">Start</th>
<th class="col-sm-3 visible-desktop hidden-phone">End</th>
<th class="col-sm-1 visible-desktop hidden-phone">Hours</th>
<th class="col-sm-1 visible-desktop hidden-phone">Room</th>
<th class="col-sm-3 visible-phone text-right-md">Price</th>
<th class="col-sm-3 visible-phone">Client type</th>
<th class="col-sm-1 visible-desktop hidden-phone visible-tablet text-center" data-sorting="disabled">Comment</th>
</tr>

Thank you,

Best Regards,
Ajm