DataTables -Bestellungen zweimal aufsteigen
Posted: 22 Feb 2025, 00:07
Ich verwende history.pushstate / So speichern Sie den Bestellzustand einer Tabelle (mit Serverside Verarbeitung und orderMulti auf false ) jedes Mal, wenn der Benutzer auf ein TH klickt. Anschließend verwende ich .on ("popstate") , um die gespeicherte Bestellung wiederherzustellen. Bestellen Sie ein zweites Mal, wenn der Benutzer in derselben Spalte erneut beauftragt (d. H. Die Tabelle führt sich neu, aber die Bestellung ändert sich nicht). Beachten Sie, dass beim Abstieg die wiederhergestellte Bestellung bei der Bestellung in derselben Spalte wie erwartet neu ordnet. Lang-Js PrettyPrint-Override ">setTableState = function() {
let state = history.state, url = "/"+location.pathname.split("/")[1]+"/",
order = myTable.order();
if (state) state["sort"] = {};
else state = { "sort": {} };
if (order.length && order[0][1]) {
state["sort"]["name"] = myTable.columns(order[0][0]).init()[0].name;
state["sort"]["dir"] = order[0][1];
url += "sort:" + (state["sort"]["dir"] == "desc" ? "-" : "") + state["sort"]["name"] + "/";
}
if (url == location.pathname) history.replaceState(state, ""); // Prevent duplication of history item
else history.pushState(state, "", url);
}
< /code>
Speichern und Wiederherstellen der Bestellung: < /p>
$(document).ready(function() {
// Needs to be done this way to ensure the event only fires on manual ordering by the user.
// The click event will fire BEFORE the ordering takes place, so we need the .on("order.mc") event to capture the new order.
$(myTableId + " th").on("click", function() {
myTable.on("order.mc", function() {
myTable.off("order.mc");
setTableState();
});
});
$(window).on("popstate", function(e) {
if (history.state && "sort" in history.state && !jQuery.isEmptyObject(history.state["sort"])) {
myTable.order([{ name: history.state["sort"]["name"], dir: history.state["sort"]["dir"] }]);
}
else myTable.order(defaultSort);
myTable.draw();
});
});
< /code>
Da es korrekt funktioniert, wenn die wiederhergestellte Reihenfolge in absteigender Richtung ist (d. H. Sie ändert sich in einem nicht ordnungsgemäßen Zustand, wenn es in derselben Spalte neu ordnet), scheint es wie ein Fehler mit DataTables selbst? /P>
Code: Select all
history.replaceState
let state = history.state, url = "/"+location.pathname.split("/")[1]+"/",
order = myTable.order();
if (state) state["sort"] = {};
else state = { "sort": {} };
if (order.length && order[0][1]) {
state["sort"]["name"] = myTable.columns(order[0][0]).init()[0].name;
state["sort"]["dir"] = order[0][1];
url += "sort:" + (state["sort"]["dir"] == "desc" ? "-" : "") + state["sort"]["name"] + "/";
}
if (url == location.pathname) history.replaceState(state, ""); // Prevent duplication of history item
else history.pushState(state, "", url);
}
< /code>
Speichern und Wiederherstellen der Bestellung: < /p>
$(document).ready(function() {
// Needs to be done this way to ensure the event only fires on manual ordering by the user.
// The click event will fire BEFORE the ordering takes place, so we need the .on("order.mc") event to capture the new order.
$(myTableId + " th").on("click", function() {
myTable.on("order.mc", function() {
myTable.off("order.mc");
setTableState();
});
});
$(window).on("popstate", function(e) {
if (history.state && "sort" in history.state && !jQuery.isEmptyObject(history.state["sort"])) {
myTable.order([{ name: history.state["sort"]["name"], dir: history.state["sort"]["dir"] }]);
}
else myTable.order(defaultSort);
myTable.draw();
});
});
< /code>
Da es korrekt funktioniert, wenn die wiederhergestellte Reihenfolge in absteigender Richtung ist (d. H. Sie ändert sich in einem nicht ordnungsgemäßen Zustand, wenn es in derselben Spalte neu ordnet), scheint es wie ein Fehler mit DataTables selbst? /P>