Added table filter to Locations, Moved table filter js to site.js

This commit is contained in:
2025-10-26 08:29:00 +01:00
parent 701d712923
commit ab09de5ba8
3 changed files with 34 additions and 29 deletions

View File

@@ -70,35 +70,6 @@
</div> </div>
</div> </div>
<!-- Table filter -->
<script>
document.addEventListener('DOMContentLoaded', () => {
const filters = document.querySelectorAll('.column-filter');
const table = document.querySelector('table');
const tbody = table.querySelector('tbody');
filters.forEach(filter => {
filter.addEventListener('input', () => {
const rows = tbody.querySelectorAll('tr');
const filterValues = Array.from(filters).map(f => f.value.toLowerCase().trim());
rows.forEach(row => {
const cells = row.querySelectorAll('td');
let visible = true;
filterValues.forEach((val, i) => {
if (val && !cells[i].textContent.toLowerCase().includes(val)) {
visible = false;
}
});
row.style.display = visible ? '' : 'none';
});
});
});
});
</script>
<!-- Asset Delete Confirmation Modal --> <!-- Asset Delete Confirmation Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true"> <div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered"> <div class="modal-dialog modal-dialog-centered">

View File

@@ -27,6 +27,13 @@
<th>@T["Seat"]</th> <th>@T["Seat"]</th>
<th>@T["Action"]</th> <th>@T["Action"]</th>
</tr> </tr>
<tr>
<th><input type="text" class="form-control form-control-sm column-filter" placeholder="@T["Location ID"]" data-column="0" /></th>
<th><input type="text" class="form-control form-control-sm column-filter" placeholder="@T["Location Name"]" data-column="1" /></th>
<th><input type="text" class="form-control form-control-sm column-filter" placeholder="@T["Room Number"]" data-column="2" /></th>
<th><input type="text" class="form-control form-control-sm column-filter" placeholder="@T["Seat"]" data-column="3" /></th>
<th class="text-center">-</th>
</tr>
</thead> </thead>
<tbody> <tbody>
@{ @{

View File

@@ -89,3 +89,30 @@ function idToEAN13(id) {
const padded = id.toString().padStart(12, "0"); // 12 digits const padded = id.toString().padStart(12, "0"); // 12 digits
return padded; return padded;
} }
// Table filter
document.addEventListener('DOMContentLoaded', () => {
const filters = document.querySelectorAll('.column-filter');
const table = document.querySelector('table');
const tbody = table.querySelector('tbody');
filters.forEach(filter => {
filter.addEventListener('input', () => {
const rows = tbody.querySelectorAll('tr');
const filterValues = Array.from(filters).map(f => f.value.toLowerCase().trim());
rows.forEach(row => {
const cells = row.querySelectorAll('td');
let visible = true;
filterValues.forEach((val, i) => {
if (val && !cells[i].textContent.toLowerCase().includes(val)) {
visible = false;
}
});
row.style.display = visible ? '' : 'none';
});
});
});
});