change the way data is displayed on different device screen

change the way data is displayed on different device screen

birobiro Posts: 12Questions: 7Answers: 0

Hi yall!
first of all your plugin is awsome!

What i need to do is change the way the table is displayed on different devices.
I got a table who need 17 columns to be showed, especially on tablets (768px wide at least).
actually with wider screen there are no problems, but when i shrink the browser window under 900px (more or less) it start hiding columns.

Is there a way to choose which column to hide or to "reorder" the informations (something like group these 3 columns or something like that)

I'm currently using bootstrap and jQuery

Here's the code
```
<---HTML--->

Customers LAST
SALE
Log. 14/11/2016 Compared
with 2015
Log. 14/11/2016 Log. 14/11/2016 Log. 14/11/2016
Customers No. 102 Customers No. 102 Customers No. 102 Customers No. 102
BUDGET % BOX BC SALES % BOX SALES % BOX SALES % BOX

and JS

$('#planning-seller-datatable').dataTable( {
responsive:{details:true},
dom:"Blts",
buttons: [
'copyHtml5',
'excelHtml5',
'csvHtml5',
'pdfHtml5'
],
"ajaxSource": "data.json",
"columns": [
{ "data": "azienda" },
{ "data": "lastsale",type:"date" },
{ "data": "budget",render: formatCurrency },
{ "data": "percent1" },
{ "data": "box" },
{ "data": "bc", orderable:false },
{ "data": "compared" , orderable:false},
{ "data": "l1s",render: formatCurrency },
{ "data": "l1p" },
{ "data": "b1p" },
{ "data": "l2s",render: formatCurrency },
{ "data": "l2p" },
{ "data": "b2p" },
{ "data": "l3s",render: formatCurrency },
{ "data": "l3p" },
{ "data": "b3p" },
{ "data": "grph", orderable:false, className:'icone' },

]
} );```

This discussion has been closed.