文志新引导程序表详细信息默认展开视图



我正在使用Bootstrap Table和一个表,该表可以通过按下左侧的加号按钮来显示详细视图。我正在寻找一种方法,使展开的详细信息视图成为默认行为,并使用减号来折叠数据。我在API上找不到任何解决方案。我正在使用jinja和Flask填充表,所以我希望找到一个使用以下代码的解决方案。

<table id="table"
data-toggle="table"
data-filter-control="true"
data-show-search-clear-button="true"
data-sortable="true"
classes="table-sm"
data-pagination="true"
data-show-columns="true"
data-show-columns-toggle-all="true"
class="table-responsive"

data-toolbar="#toolbar"
data-search="true"
data-show-refresh="true"
data-show-toggle="true"
data-show-fullscreen="true"
data-show-columns="true"
data-show-columns-toggle-all="true"
data-detail-view="true"
data-show-export="true"
data-click-to-select="true"
data-detail-formatter="detailFormatter"
data-minimum-count-columns="2"
data-show-pagination-switch="true"
data-pagination="true"
data-id-field="id"
data-page-list="[10, 25, 50, 100, all]"
data-show-footer="true"
>
<thead>
<tr>
<th data-field="link" data-filter-control="input" data-sortable="true" data-visible="false">asdf</th>
<th data-field="asdf" data-filter-control="input" data-sortable="true" data-visible="false">asdf</th>
<!--special characters and spaces not allowed in data-field name-->
<th data-field="asdf" data-filter-control="input" data-sortable="true">asdf</th>
<th data-field="asdf" data-filter-control="input" data-sortable="true">asdf</th>
<th data-field="asdf" data-filter-control="select" data-sortable="true">asdf </th>
<th data-field="asdf" data-filter-control="input" data-sortable="true" data-visible="false">asdf</th>
</tr>
</thead>
<tbody>
{% for row in tableA %}
<tr>

<!--non visibili  -->
<td>{{row['asdf']|safe}}</td>
<td>{{ row['asdf'][0]['asdf'] }}</td>
<!--special characters and spaces not allowed in data-field name-->
<td>{{ row['asdf'][0]['df'] }}</td>
<td>{{ row['sdf'][0]['asdf'] }}</td>
<td>{{ row['asdf'][0]['asdf'] }}</td>
<td>{{url_for('asdf', asdf=row['asdf'])}}</td>
</tr>
{% endfor %}
</tbody>
</table>

到目前为止,这是我提出的唯一一个对我有效的解决方案,至少在用户查询表之前是这样。

$( document ).ready(function() {
window.onload = setTimeout(function() {
var x = document.getElementsByClassName("detail-icon");
x.forEach(element =>element.click())
}, 1000);
});

最新更新