jQuery BootGrid - Hiding columns with data-visible=“false” removes from DOM

问题

With BootGrid, you can hide columns by using data-visible="false" in your th column definitions. This creates a problem in that, rather than just hiding the column, it appears to remove it from the DOM. Columns (First two do not show)

<tr>
    <th data-column-id="id" data-type="numeric" data-identifier="true" data-visible="false">ID</th>
    <th data-column-id="User" data-visible="false">User</th>
    <th data-column-id="Title">Title</th>
    <th data-column-id="Description">Description</th>
    <th data-column-id="Expire" data-formatter="expire" data-sortable="true">Expire</th>
    <th data-column-id="commands" data-formatter="commands" data-sortable="false">Commands</th>
</tr>

The Problem With ID and User set to data-visible="False" their values are inaccessible. Using data-visible="false" seems to make these fields non-existant altogether. I need to be able to access these values.

回答1:

There are two data parameters: header-css-class and css-class the usage of which is not well explained in the documentation I read. I set up two classes with display:none, which I named "Hidecolhead" and HideCol". Then, in the columns I do not want to display (ID and user) in the grid, I have

<th data-column-id="ID" data-header-css-class="HideColHead" data-css-class="HideCol">ID</th>
<th data-column-id="User" data-header-css-class="HideColHead" data-css-class="HideCol">User</th>

The values in these row columns are now available.

来源：https://stackoverflow.com/questions/45013794/jquery-bootgrid-hiding-columns-with-data-visible-false-removes-from-dom