Change datatables to bootstrap-table in select

This commit is contained in:
2023-06-07 00:32:33 +02:00
parent 3b458eab08
commit f0c8d51682
4 changed files with 30 additions and 53 deletions

View File

@@ -7,17 +7,22 @@
</div>
</div>
<table id="file-table"
class="table table-striped table-hover table-bordered">
class="table table-striped table-hover table-bordered bg-light"
data-toggle="table"
data-sticky-header="true"
data-sticky-header-offset-y="50"
data-sortable="true"
data-search="true">
<thead>
<tr class="table-primary">
<th>Model</th>
<th>Metric</th>
<th>Platform</th>
<th>Date</th>
<th>Time</th>
<th>Stratified</th>
<th>Title</th>
<th>Score</th>
<tr class="bg-primary text-white">
<th data-field="model" data-sortable="true">Model</th>
<th data-field="metric" data-sortable="true">Metric</th>
<th data-field="platform" data-sortable="true">Platform</th>
<th data-field="date" data-sortable="true">Date</th>
<th data-field="time" data-sortable="true">Time</th>
<th data-field="stratified" data-sortable="true">Stratified</th>
<th data-field="title" data-sortable="true">Title</th>
<th data-field="score" data-sortable="true">Score</th>
<th>
<button class="btn btn-primary btn-small btn-danger"
onclick="setCheckBoxes(false)">
@@ -37,9 +42,9 @@
<td>{{ parts[2] }}</td>
<td>{{ parts[1] }}</td>
<td>{{ parts[3] }}</td>
<td>{{ parts[4] }}</td>
<td>{{ parts[5] }}</td>
<td>{{ 'True' if stratified =='1' else 'False' }}</td>
<td class="text-center">{{ parts[4] }}</td>
<td class="text-center">{{ parts[5] }}</td>
<td class="text-center">{{ 'True' if stratified =='1' else 'False' }}</td>
<td>{{ "%s" % data["title"] }}</td>
<td class="text-end">{{ "%.6f" % data["score"] }}</td>
<td>

View File

@@ -10,15 +10,6 @@
{% endblock %}
{% block content %}
{% include "_table_report.html" %}
<table data-url="https://examples.wenzhixin.net.cn/examples/bootstrap_table/data">
<thead>
<tr>
<th data-field="id">ID</th>
<th data-field="name">Item Name</th>
<th data-field="price" data-sortable="true">Item Price</th>
</tr>
</thead>
</table>
{% endblock %}
{% block jscript %}
{{ super() }}

View File

@@ -2,16 +2,19 @@
{% block styles %}
{{ super() }}
<link rel="stylesheet"
href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.min.css">
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css">
<link rel="stylesheet"
href="https://unpkg.com/bootstrap-table@1.21.4/dist/bootstrap-table.min.css">
<link href="https://unpkg.com/bootstrap-table@1.21.4/dist/extensions/sticky-header/bootstrap-table-sticky-header.css"
rel="stylesheet">
{% endblock %}
{% block content %}
{% include "_table_select.html" %}
{% endblock %}
{% block jscript %}
{{ super() }}
<script src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<script rel="stylesheet"
href="https://cdn.datatables.net/1.13.4/js/dataTables.bootstrap5.min.js"></script>
<script src="https://unpkg.com/bootstrap-table@1.21.4/dist/bootstrap-table.min.js"></script>
<script src="https://unpkg.com/bootstrap-table@1.21.4/dist/extensions/sticky-header/bootstrap-table-sticky-header.min.js"></script>
<script src="{{ url_for('static', filename="js/select.js") }}"></script>
<script src="{{ url_for('static', filename="js/excelFiles.js") }}"></script>
{% endblock %}

View File

@@ -1,33 +1,11 @@
$(document).ready(function () {
var table = $("#file-table").DataTable({
paging: true,
searching: true,
ordering: true,
info: true,
"select.items": "row",
pageLength: 25,
columnDefs: [
{
targets: 8,
orderable: false,
},
],
//"language": {
// "lengthMenu": "_MENU_"
//}
});
$('#file-table').on( 'draw.dt', function () {
enable_disable_best_buttons();
} );
// Check if row is selected
$("#file-table tbody").on("click", "tr", function () {
if ($(this).hasClass("selected")) {
$(this).removeClass("selected");
$('#file-table tbody').on('click', 'tr', function () {
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
} else {
table
.$("tr.selected")
.removeClass("selected");
$(this).addClass("selected");
$('#file-table tbody tr.selected').removeClass("selected")
$(this).addClass('selected');
}
});
// Show file with doubleclick