54 lines
2.0 KiB
JavaScript
54 lines
2.0 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function () {
|
|
const searchInput = document.getElementById('searchInput');
|
|
const vocabularyTable = document.getElementById('vocabularyTable');
|
|
const tableBody = vocabularyTable.getElementsByTagName('tbody')[0];
|
|
const rows = tableBody.getElementsByTagName('tr');
|
|
|
|
// Search functionality
|
|
searchInput.addEventListener('keyup', function () {
|
|
const filter = searchInput.value.toLowerCase();
|
|
for (let i = 0; i < rows.length; i++) {
|
|
let cells = rows[i].getElementsByTagName('td');
|
|
let found = false;
|
|
for (let j = 0; j < cells.length; j++) {
|
|
if (cells[j].innerHTML.toLowerCase().indexOf(filter) > -1) {
|
|
found = true;
|
|
break;
|
|
}
|
|
}
|
|
if (found) {
|
|
rows[i].style.display = '';
|
|
} else {
|
|
rows[i].style.display = 'none';
|
|
}
|
|
}
|
|
});
|
|
|
|
// Sort functionality
|
|
const headers = vocabularyTable.getElementsByTagName('th');
|
|
for (let i = 0; i < headers.length; i++) {
|
|
headers[i].addEventListener('click', function () {
|
|
const column = i;
|
|
const sortOrder = this.classList.contains('asc') ? 'desc' : 'asc';
|
|
for (let j = 0; j < headers.length; j++) {
|
|
headers[j].classList.remove('asc', 'desc');
|
|
}
|
|
this.classList.add(sortOrder);
|
|
|
|
const sortedRows = Array.from(rows).sort((a, b) => {
|
|
const aText = a.getElementsByTagName('td')[column].innerText;
|
|
const bText = b.getElementsByTagName('td')[column].innerText;
|
|
return aText.localeCompare(bText, undefined, { numeric: true }) * (sortOrder === 'asc' ? 1 : -1);
|
|
});
|
|
|
|
while (tableBody.firstChild) {
|
|
tableBody.removeChild(tableBody.firstChild);
|
|
}
|
|
|
|
sortedRows.forEach(row => {
|
|
tableBody.appendChild(row);
|
|
});
|
|
});
|
|
}
|
|
});
|