Bootstrap-table 如何调整高度以显示数据

Question

我正在使用 bootstrap-table 创建我的表，它运行良好，但它看起来有点奇怪，因为高度似乎只是固定的，不管它有多少数据。因此，如果我只有 6 条记录，那么下面就只有这个尴尬的空白空间。这是我的html：

<table class="table" data-toggle="table" data-page-size="10" data-pagination="true" data-search="true">
<thead>
    <tr>
        <th data-sortable="true">Username</th>
        <th data-sortable="true">Full Name</th>
        <th data-sortable="true">Points</th>
        {% for subject in subjects %}
        <th data-sortable="true">{{ subject }}</th>
        {% endfor %}
    </tr>
</thead>
<tbody>
    {% for user in users %}
    <tr>
        <td>
            <a href="{% url 'profile' username=user.username %}">{{ user.username }}</a>
        </td>
        <td>{{ user.first_name }} {{ user.last_name }}</td>
        {% for item in user.profile.points %}
        <td>{{ item.1 }}</td>
        {% endfor %}
    </tr>
    {% endfor %}
</tbody>

这是我页面的截图：

关于如何解决这个问题的任何想法？

Answer 1

使用“高度”属性。

 $table.bootstrapTable({
        ***height: getHeight(),***
        columns: [
            [

function getHeight() {
    return $(window).height() - $('h1').outerHeight(true);
}

See this example.