ynerant
/
nk20
mirror of https://gitlab.crans.org/bde/nk20
1
0
Fork 0
Code Issues Releases Wiki Activity

Update URL when searching

This commit is contained in:
Alexandre Iooss 2020-08-22 09:35:55 +02:00
parent 8465b24d7d
commit 2272cf5294
1 changed files with 27 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
note_kfet/templates/base_search.html
View File

@ -12,7 +12,8 @@ SPDX-License-Identifier: GPL-3.0-or-later
{{ title }} {{ title }}
</h3> </h3>
<div class="card-body"> <div class="card-body">
<input id="searchbar" type="text" class="form-control" placeholder="{% trans "Search by attribute such as name…" %}"> <input id="searchbar" type="text" class="form-control"
placeholder="{% trans "Search by attribute such as name…" %}">
</div> </div>
<div id="dynamic-table"> <div id="dynamic-table">
{% if table.data %} {% if table.data %}
@ -30,8 +31,6 @@ SPDX-License-Identifier: GPL-3.0-or-later
{% block extrajavascript %} {% block extrajavascript %}
<script type="text/javascript"> <script type="text/javascript">
let pattern = '';
function reloadTable() { function reloadTable() {
pattern = $("#searchbar").val(); pattern = $("#searchbar").val();
@ -46,24 +45,42 @@ SPDX-License-Identifier: GPL-3.0-or-later
}); });
// Highlight searched terms // Highlight searched terms
$("tr").each(function () { const pattern = $("#searchbar").val();
$(this).find("td:eq(0), td:eq(1), td:eq(2), td:eq(3), td:eq(5)").each(function () { if (pattern.length > 2) {
$(this).html($(this).text().replace(new RegExp(pattern, 'i'), "<mark>$&</mark>")); $("tr").each(function () {
$(this).find("td:eq(0), td:eq(1), td:eq(2), td:eq(3), td:eq(5)").each(function () {
$(this).html($(this).text().replace(new RegExp(pattern, 'i'), "<mark>$&</mark>"));
});
}); });
}); }
} }
$(document).ready(function () { $(document).ready(function () {
let pattern = '';
// Recover last search from url // Recover last search from url
let searchParams = new URLSearchParams(window.location.search) let searchParams = new URLSearchParams(window.location.search)
if (searchParams.has('search')) if (searchParams.has('search')) {
pattern = searchParams.get('search'); pattern = searchParams.get('search');
}
// On search, refresh table // On search, refresh table
$("#searchbar").keyup(debounce(reloadTable, 300)); $("#searchbar").keyup(debounce(function () {
// Get new pattern
pattern = $("#searchbar").val();
// Set URL
searchParams.set('search', pattern);
history.pushState({}, null, "?" + searchParams.toString());
// If long enough, update table
if (pattern.length > 2) {
$("#dynamic-table").load(location.pathname + "?search=" + pattern.replace(" ", "%20") + " #dynamic-table", init_table);
}
}, 300));
// First init // First init
init_table(); init_table();
}); });
</script> </script>
{% endblock %} {% endblock %}