|
Tags: Replaced Manual revert |
(2 intermediate revisions by the same user not shown) |
Line 1: |
Line 1: |
| /* Any JavaScript here will be loaded for all users on every page load. */ | | /* Any JavaScript here will be loaded for all users on every page load. */ |
|
| |
| #Filterable tables
| |
| document.addEventListener("DOMContentLoaded", function () {
| |
| function createFilterInputs(table) {
| |
| let thead = table.querySelector("thead");
| |
| if (!thead) return;
| |
| let headerRow = thead.rows[0];
| |
| let filterRow = document.createElement("tr");
| |
|
| |
| for (let i = 0; i < headerRow.cells.length; i++) {
| |
| let th = document.createElement("th");
| |
| let input = document.createElement("input");
| |
|
| |
| input.setAttribute("type", "text");
| |
| input.setAttribute("placeholder", "Filter...");
| |
| input.style.width = "90%";
| |
| input.dataset.column = i;
| |
|
| |
| input.addEventListener("keyup", function () {
| |
| let col = this.dataset.column;
| |
| let filter = this.value.toLowerCase();
| |
| let tbody = table.querySelector("tbody");
| |
| let rows = tbody.getElementsByTagName("tr");
| |
|
| |
| for (let row of rows) {
| |
| let cell = row.getElementsByTagName("td")[col];
| |
| if (cell) {
| |
| let text = cell.textContent || cell.innerText;
| |
| row.style.display = text.toLowerCase().includes(filter) ? "" : "none";
| |
| }
| |
| }
| |
| });
| |
|
| |
| th.appendChild(input);
| |
| filterRow.appendChild(th);
| |
| }
| |
| thead.appendChild(filterRow);
| |
| }
| |
|
| |
| function makeTablesFilterable() {
| |
| document.querySelectorAll(".filterable-table").forEach(table => {
| |
| createFilterInputs(table);
| |
| });
| |
| }
| |
|
| |
| makeTablesFilterable();
| |
| });
| |