improve table sorting

This commit is contained in:
Dennis Eichhorn 2021-03-07 21:37:26 +01:00
parent 6ef63d10df
commit ec8838719b
3 changed files with 60 additions and 0 deletions

View File

@ -145,6 +145,12 @@ export class Table
for (let i = 0; i < length; ++i) {
this.bindFiltering(filters[i], id);
}
const checkboxes = this.tables[id].getCheckboxes();
length = checkboxes.length;
for (let i = 0; i < length; ++i) {
this.bindCheckbox(checkboxes[i], id);
}
};
/**
@ -235,6 +241,7 @@ export class Table
const columnName = this.closest('td').getAttribute('data-name');
// only necessary for retrieving remote data
table.setAttribute('data-sorting', (sortType > 0 ? '+' : '-') + (columnName !== null ? columnName : cellId));
if (table.getAttribute('data-src') !== null) {
@ -350,6 +357,32 @@ export class Table
});
};
/**
* Checkbox select.
*
* @param {Element} checkbox Filter button
* @param {Object} id Table id
*
* @return {void}
*
* @since 1.0.0
*/
bindCheckbox(checkbox, id)
{
checkbox.addEventListener('click', function (event)
{
const columnId = checkbox.closest('td').cellIndex;
const rows = checkbox.closest('table').querySelectorAll('tbody tr');
const rowLength = rows.length;
const status = checkbox.checked;
for (let i = 0; i < rowLength; ++i) {
const box = rows[i].cells[columnId].querySelector('input[type=checkbox]');
box.checked = status;
}
});
}
static getRemoteData (table)
{
const data = {

View File

@ -68,6 +68,19 @@ export class GeneralUI
// @todo: implement middle mouse click
e[i].addEventListener('click', function(event) {
if ((event.target.parentElement !== this
&& event.target.parentElement.getElementsByTagName('input').length > 0)
|| (event.target.getElementsByTagName('input').length > 0)
) {
const input = event.target.querySelector('input');
if (input !== null) {
input.click();
}
return;
}
jsOMS.preventAll(event);
history.pushState(null, null, window.location);

View File

@ -134,6 +134,20 @@ export class TableView
);
};
/**
* Get table header elements which provide filter functionality
*
* @return {Array}
*
* @since 1.0.0
*/
getCheckboxes()
{
return document.querySelectorAll(
'#' + this.id + ' thead input[type=checkbox]'
);
};
/**
* Get row elements which allow to swap the current row with another row
*