serch box

This commit is contained in:
bronkuu 2026-06-15 17:44:10 +02:00
parent e8ea70d61e
commit 06231cc490

View file

@ -77,11 +77,26 @@ templ OrdersMain(orders []models.Order) {
<span class="material-symbols-outlined">list_alt</span>
Aktywne zamówienia
</h2>
<div style="position:relative;width:11.25rem">
<span class="material-symbols-outlined" style="position:absolute;left:0.5rem;top:50%;transform:translateY(-50%);font-size:1rem;color:var(--on-surface-variant);pointer-events:none">search</span>
<input type="text" style="height:1.75rem;padding-left:1.75rem;padding-right:0.5rem;font-size:0.75rem;border:1px solid var(--outline-variant);border-radius:var(--border-radius-sm);background:var(--surface-container-lowest);color:var(--on-surface);outline:none;width:100%" placeholder="Szukaj..." oninput="filterOrders(this)"/>
</div>
</header>
<div class="table-container" id="results-table">
@OrdersTable(orders)
</div>
</section>
<script>
function filterOrders(input) {
var q = input.value.toLowerCase();
var rows = document.querySelectorAll('#results-table tbody tr');
for (var i = 0; i < rows.length; i++) {
var id = rows[i].children[0].textContent.toLowerCase();
var customer = rows[i].children[1].textContent.toLowerCase();
rows[i].style.display = id.includes(q) || customer.includes(q) ? '' : 'none';
}
}
</script>
}
templ OrdersTable(orders []models.Order) {