tableSorter(..) 추가

master
mjkhan21 4 months ago
parent 082f596e0a
commit 7b3f99c6ee

@ -797,39 +797,6 @@ function inputsInRange(fromSource, toSource) {
to.change(compare);
}
var sorting = {
asc: "&#11205",
desc: "&#11206",
/** .
* @param headers th 목록
* @param sorter 데이터셋이 반환한 정렬 상태
*/
setHeaders: (headers, sorter) => {
document.querySelectorAll("th[data-field]").forEach(th => {
let inner = th.innerHTML;
inner = inner.replace(/ ⯅/gi, "").replace(/ ⯆/gi, "");
if (th.getAttribute("data-field") == sorter.by)
inner += " " + sorting[sorter.order] || "";
th.innerHTML = inner;
});
}
/*
asc: {style: "sorting_asc", attr: "ascending"},
desc: {style: "sorting_desc", attr: "descending"},
setHeaders: (headers, sorter) => {
headers.forEach(th => {
th.classList.remove("sorting_asc", "sorting_desc");
th.removeAttribute("aria-sort");
if (th.getAttribute("data-field") != sorter.by) return;
th.classList.add(sorting[sorter.order].style);
th.setAttribute("aria-sort", sorting[sorter.order].attr);
});
}
*/
};
function ignore() {
console.log.apply(console, arguments);
}

@ -1730,4 +1730,61 @@ var dataBinder = {
return obj;
},
};
};
/**<table../> 표시되는 데이터셋의 데이터를 정렬하고 UI에 반영되도록 설정한다.
* @param ctrl {DatasetControl} DatasetControl
* @param selector 테이블 헤더에 대한 selector
*/
function tableSorter(ctrl, selector) {
let obj = {
asc: "&#11205",
desc: "&#11206",
ctrl: ctrl,
headers: () => ctrl.querySelectorAll(selector),
sort: (evt) => {
let th = evt.target;
ctrl.sort(th.getAttribute("data-field"));
}
};
obj.setHeaders = (sorter) => {
obj.headers().forEach(th => {
let inner = th.innerHTML;
inner = inner.replace(/ ⯅/gi, "").replace(/ ⯆/gi, "");
if (th.getAttribute("data-field") == sorter.by)
inner += " " + obj[sorter.order] || "";
th.innerHTML = inner;
});
};
ctrl.onSort = (sorter) => {
if (ctrl.renderList)
ctrl.renderList();
obj.setHeaders(sorter);
};
obj.headers().forEach(th => {
th.style["cursor"] = "pointer";
th.removeEventListener("click", obj.sort);
th.addEventListener("click", obj.sort);
});
return obj;
/*
asc: {style: "sorting_asc", attr: "ascending"},
desc: {style: "sorting_desc", attr: "descending"},
setHeaders: (headers, sorter) => {
headers.forEach(th => {
th.classList.remove("sorting_asc", "sorting_desc");
th.removeAttribute("aria-sort");
if (th.getAttribute("data-field") != sorter.by) return;
th.classList.add(sorting[sorter.order].style);
th.setAttribute("aria-sort", sorting[sorter.order].attr);
});
}
*/
}
Loading…
Cancel
Save