jquery - jQuery-bootgrid 如何仅在 Mobile 和 Tab 中隐藏列

Question

我想隐藏选项卡中的数据列。我提到了 Bootgrid 文档。

在我发现的列设置中。

data-visible="false"

它也隐藏了 PC 中的数据列。我需要类似的东西

 .hidden-xs, .hidden-sm

Answer 1

调用了两个列设置cssClass，headerCssClass它们完全按照您的要求进行。如果您在列标题数据属性中设置hidden-xs和hidden-sm分类，则该列将在小型设备上隐藏。请注意，数据属性分别被调用data-css-class和data-header-css-class。

<thead>
    <tr>
        <th data-column-id="id" data-visible="false">ID</th>
        <th data-column-id="firstname">First Name</th>
        <th data-column-id="lastname" data-order="asc">Last Name</th>
        <th data-column-id="registerdate" 
            data-css-class="hidden-xs hidden-sm" 
            data-header-css-class="hidden-xs hidden-sm">Date</th>
    </tr>
</thead>