“在jquery bootgrid中滚动内容时如何固定标题”

Question

我试图在jquery bootgrid中滚动主要内容时使标头固定。如何使标题固定在其位置？

这是我的代码

    <div class="table-responsive" style="display:block;height:500px;overflow:scroll ;width:100%;">

            <table id="grid-data" class="table  table-bordered  table-sm table-striped table-hover " data-selection="true" data-multi-select="true" data-row-select="true" data-keep-selection="true">
                <thead>
                    <tr>
                        <th data-column-id="ItemCode" data-sortable="false">Item Code</th>
                        <th data-column-id="ItemDescription" data-sortable="false">Item Description</th>
                        <th data-column-id="UnitName" data-formatter="UnitName" data-sortable="false">Unit Name</th>
                        <th data-column-id="QOH" data-formatter="Quantity" data-sortable="false">Quantity</th>
                        <th data-column-id="MaterialCost" data-formatter="Price" data-sortable="false">Price</th>
                        <th data-column-id="RowNumber" data-formatter="Amount" data-sortable="false">Amount</th>

                    </tr>
                </thead>

            </table>

        </div>