Initially hide some columns

[MB34]

We have data that has up to 20 columns, we want to hide some of them on initialization but have them available in the drop down. How do I do that?

[claar]

Add data-visible="false" to the <th>'s you want to initially hide. See Column Settings -> visible in the docs.

[rstaib]

@claar Thanks for anwsering the questing.

[kthangabalu]

hi can somebody tell be how to data-visible="true" dynamically using javascript

[hjmf1954]

I have exact the same question as Ktangabalu. In a responsive design environment it may be useful to hide more columns in a mobile portrait environment than in a desktop landscape. Since the only correct way to find that out is in the client, JavaScript is the only method to do that.
So the hide/unhide column feature is a nice-to-have option.
In pure JavaScript the hiding of the column(s) is an alternative by adding the id or adding a extra class to both the and the in the grid.
Or is an extra reload of the grid a better solution with the additions of the screen-settings?
Or are there better alternatives??

Do I need to create a new issue for this question?