Hledání receptů podle názvu

This commit is contained in:
Emil Miler 2021-02-02 23:39:29 +01:00
parent 4f88150e94
commit 1d889d4c0a

View File

@ -4,9 +4,7 @@
<main> <main>
<h2>Hledání a filtry</h2> <h2>Hledání a filtry</h2>
<div class="filters"> <div class="filters">
<input type="text" id="name" placeholder="Název"> <input type="text" placeholder="Název" oninput="filter_name(this.value)">
<input type="text" id="name" placeholder="Název">
<input type="text" id="name" placeholder="Název">
</div> </div>
<section class="list"> <section class="list">
{% set section = get_section(path="_index.md") %} {% set section = get_section(path="_index.md") %}
@ -16,3 +14,27 @@
</section> </section>
</main> </main>
{% endblock content %} {% endblock content %}
{% block script %}
<script>
function filter_name(str) {
let articles = document.getElementsByTagName("article");
str = str.toLowerCase();
if (str.length==0) {
for (let i=0; i<articles.length; i++) {
articles[i].style.display = "flex";
}
} else {
for (let i=0; i<articles.length; i++) {
let name = articles[i].getElementsByTagName("h3")[0].innerHTML.toLowerCase();
if (!name.includes(str)) {
articles[i].style.display = "none";
} else {
articles[i].style.display = "flex";
}
}
}
}
</script>
{% endblock script %}