[Bootstrap Table] Filtrage coté client par variable en URL
Bonjour
J'utilise Bootstrap table pour mettre en forme mes données visibles à cette adresse : https://www.pyrenees-refuges.com/liste.php
Je voudrais passer des commander en URL du type https://www.pyrenees-refuges.com/lis...rtement=Aragon
Je voudrais que ce filtrage se fasse coté client
À noter ma configuration actuelle :
Code:
1 2 3 4 5 6 7
| data-filter-control="true"
data-filter-show-clear="true"
data-sortable="true"
data-show-export="true"
data-pagination="true"
data-query-params="queryParams"
data-url="./data/pyrenees.json" |
HEAD
Code:
1 2
| <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.14.2/dist/bootstrap-table.min.css"> |
HTML
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38
| <div class="row" >
<div class="col-sm-12 col-md-offset-5">
<div class="card" >
<div class="card-header">
<h5>Recherche de refuges & cabanes :</h5>
</div>
<div class="card-body">
<p class="card-text">
<table
id="table"
data-filter-control="true"
data-filter-show-clear="true"
data-sortable="true"
data-show-export="true"
data-pagination="true"
data-query-params="queryParams"
data-url="./data/pyrenees.json">
<thead>
<tr>
<th data-field="id" data-formatter="nameFormatter">URL</th>
<th data-field="name" data-filter-control="input" data-sortable="true">Nom</th>
<th data-field="type" data-filter-control="select" data-sortable="true">Type</th>
<th data-field="departement" data-filter-control="select" data-sortable="true">Departement</th>
<th data-field="ville" data-filter-control="input" data-sortable="true">Ville</th>
<th data-field="capete" data-filter-control="input" data-sortable="true">Cap été</th>
<th data-field="caphiv" data-filter-control="input" data-sortable="true">Cap hiver</th>
<th data-field="cheminee" data-filter-control="input" data-sortable="true">Cheminée</th>
<th data-field="bois" data-filter-control="input" data-sortable="true">Bois</th>
<th data-field="eau" data-filter-control="input" data-sortable="true">Eau</th>
<th data-field="couchage" data-filter-control="input" data-sortable="true">Couchage</th>
<th data-field="ideerando" data-filter-control="input" data-sortable="true">Rando</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
</div> |
JAVASCRIPT
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14
| <script>
$(function() {
$('#table').bootstrapTable({
formatLoadingMessage: function() {
return '<b>Chargement de la base</b>';
}
})
})
function nameFormatter(value, row) {
return '<a href="https://www.pyrenees-refuges.com/fr/affiche.php?numenr=' + value + '" target="_blank">Details</a>'
}
</script> |