filters done
This commit is contained in:
@@ -28,17 +28,19 @@ const dataFilter = (dataForm) => {
|
||||
valInput = valInput.toLowerCase();
|
||||
}
|
||||
|
||||
if (item.type === "number"){
|
||||
if (valInput.value === ""){
|
||||
if(valInput.name.includes("From")){
|
||||
if (item.type === "number") {
|
||||
if (valInput === "") {
|
||||
if (item.id.includes("From")) {
|
||||
valInput = -Infinity;
|
||||
}
|
||||
else{
|
||||
else {
|
||||
valInput = Infinity;
|
||||
}
|
||||
}
|
||||
else {
|
||||
valInput = Number(valInput);
|
||||
}
|
||||
}
|
||||
// формируем очередной элемент ассоциативного массива
|
||||
dictFilter[item.id] = valInput;
|
||||
}
|
||||
@@ -47,7 +49,7 @@ const dataFilter = (dataForm) => {
|
||||
|
||||
|
||||
// фильтрация таблицы
|
||||
const filterTable = (data, idTable, dataForm) =>{
|
||||
const filterTable = (data, idTable, dataForm) => {
|
||||
|
||||
// получаем данные из полей формы
|
||||
const datafilter = dataFilter(dataForm);
|
||||
@@ -68,17 +70,22 @@ const filterTable = (data, idTable, dataForm) =>{
|
||||
result &&= val.toLowerCase().includes(datafilter[correspond[key]])
|
||||
}
|
||||
|
||||
if (typeof val == 'number') {
|
||||
result &&= datafilter[correspond[key]+"From"]<=Number(val)&& datafilter[correspond[key]+"To"]>=Number(val)
|
||||
}
|
||||
// САМОСТОЯТЕЛЬНО проверить числовые поля на принадлежность интервалу
|
||||
if (typeof val == 'number') {
|
||||
result &&= datafilter[correspond[key][0]] <= Number(val) && datafilter[correspond[key][1]] >= Number(val)
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
return result;
|
||||
});
|
||||
|
||||
// САМОСТОЯТЕЛЬНО вызвать функцию, которая удаляет все строки таблицы с id=idTable
|
||||
clearTable();
|
||||
clearTable(idTable);
|
||||
// показать на странице таблицу с отфильтрованными строками
|
||||
createTable(tableFilter, idTable);
|
||||
}
|
||||
|
||||
const clearFilters = (form) => {
|
||||
form.querySelectorAll(`& input[type="text"],& input[type="number"]`).forEach((elem) => elem.value = null)
|
||||
}
|
||||
@@ -4,20 +4,16 @@ document.addEventListener("DOMContentLoaded", function () {
|
||||
|
||||
function doInit() {
|
||||
createTable(buildings, 'list');
|
||||
const clearFiltersButton = document.getElementById("clearFiltersButton")
|
||||
const clearFiltersButton = document.getElementById("clearFiltersButton");
|
||||
clearFiltersButton.addEventListener("click", (event) => {
|
||||
clearTable("list")
|
||||
|
||||
clearFilters(filter);
|
||||
filterTable(buildings,'list',filter)
|
||||
})
|
||||
|
||||
|
||||
const applyFiltersButton = document.getElementById("applyFiltersButton")
|
||||
const applyFiltersButton = document.getElementById("applyFiltersButton");
|
||||
applyFiltersButton.addEventListener("click", (event) => {
|
||||
filterTable()
|
||||
|
||||
filterTable(buildings,'list',filter)
|
||||
})
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -1,10 +1,15 @@
|
||||
const createTable = (data, idTable) => {
|
||||
const table = document.getElementById(idTable);
|
||||
if (data.length == 0) {
|
||||
return;
|
||||
}
|
||||
const header = Object.keys(data[0]);
|
||||
|
||||
/* создание шапки таблицы */
|
||||
if (!table.firstElementChild) {
|
||||
const headerRow = createHeaderRow(header);
|
||||
table.append(headerRow);
|
||||
}
|
||||
|
||||
/* создание тела таблицы */
|
||||
const bodyRows = createBodyRows(data);
|
||||
@@ -13,7 +18,9 @@ const createTable = (data, idTable) => {
|
||||
|
||||
const clearTable = (idTable) => {
|
||||
const table = document.getElementById(idTable);
|
||||
if (table.children.length > 1) {
|
||||
table.removeChild(table.children[1]);
|
||||
}
|
||||
}
|
||||
|
||||
const createHeaderRow = (headers) => {
|
||||
@@ -26,9 +33,9 @@ const createHeaderRow = (headers) => {
|
||||
return tr;
|
||||
};
|
||||
|
||||
const createBodyRows = (rows) =>{
|
||||
const createBodyRows = (rows) => {
|
||||
const body = document.createElement('tbody');
|
||||
rows.forEach(row =>{
|
||||
rows.forEach(row => {
|
||||
const rowElement = document.createElement('tr');
|
||||
for (let key in row) {
|
||||
const td = document.createElement('td');
|
||||
|
||||
@@ -12,8 +12,9 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<form id="filter">
|
||||
<div>
|
||||
<h3>Фильтр</h3>
|
||||
<form id="filter" name="filter">
|
||||
<p>
|
||||
<label for="structure">Название:</label>
|
||||
<input type="text" id="structure">
|
||||
@@ -43,8 +44,28 @@
|
||||
<input id="applyFiltersButton" type="button" value="Найти">
|
||||
<input id="clearFiltersButton" type="button" value="Очистить фильтры">
|
||||
</form>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Сортировка</h3>
|
||||
|
||||
|
||||
<form id="sort">
|
||||
<p> Сортировать по</p>
|
||||
<p>
|
||||
<select id="fieldsFirst">
|
||||
</select>
|
||||
по убыванию? <input type="checkbox" id="fieldsFirstDesc">
|
||||
</p>
|
||||
<p>
|
||||
<select id="fieldsSecond">
|
||||
</select>
|
||||
по убыванию? <input type="checkbox" id="fieldsSecondDesc">
|
||||
</p>
|
||||
<input type="button" value="Сортировать">
|
||||
<input type="button" value="Сбросить сортировку">
|
||||
</form>
|
||||
<br>
|
||||
</div>
|
||||
|
||||
<table id="list">
|
||||
</table>
|
||||
|
||||
@@ -1,32 +0,0 @@
|
||||
// const arr = [1, 2, 3, 4, 5];
|
||||
// const replaced = arr
|
||||
// replaced.splice(2,1,100)
|
||||
// const removed = [...replaced];
|
||||
// removed.splice(3,1);
|
||||
// const updated = [...removed];
|
||||
// updated.splice(3,0,200);
|
||||
// console.log(updated);
|
||||
|
||||
const arr = [2, 2, 4, 1, 6, 12]
|
||||
|
||||
// const ret = arr.map((val, i, array) => {
|
||||
|
||||
// return array.slice(Math.max(0, i - 1), Math.min(array.length - 1, i + 2)) /
|
||||
// (Math.max(0, i - 1)-Math.min(array.length - 1, i + 1))
|
||||
// })
|
||||
|
||||
// console.log(ret)
|
||||
|
||||
// let min = arr.reduce((acc,x)=>x<acc?x:acc);
|
||||
// console.log(min)
|
||||
|
||||
|
||||
|
||||
|
||||
function groupArr(func,...args){
|
||||
return args.reduce(func)
|
||||
}
|
||||
|
||||
|
||||
|
||||
const users =
|
||||
Reference in New Issue
Block a user