Table jumps back to first page on change
Table jumps back to first page on change
redandwhite
Posts: 5Questions: 0Answers: 0
We have a function like this:
[code]
function excludeKeyword() {
var td = $(this).parent();
var tbl = $("#keywordTbl").dataTable();
var pos = tbl.fnGetPosition(td.parent()[0]);
var text = td.parent().children(":first");
var id = $(this).attr('id').replace("Btn", "");
$.post("/Client/ExcludeKeyword", { clientId: "1234", keywordId: id });
$(this).removeClass("exclude-button");
$(this).addClass("include-button");
text.children(":first").removeClass("disabled");
tbl.fnUpdate(td.html().replace("Exclude", "Include"), pos, 4); // <-------
text.children(":first").addClass("disabled");
tbl.fnUpdate("-excluded-", pos, 5); // <------
};
[/code]
The issue we're seeing is that after this method is run the table jumps back to the beginning of the list. So with 1000 items in the list, if you're operating on the last few rows you have to keep scrolling all the way down over and over. How do we get it to maintain it's position.
[code]
function excludeKeyword() {
var td = $(this).parent();
var tbl = $("#keywordTbl").dataTable();
var pos = tbl.fnGetPosition(td.parent()[0]);
var text = td.parent().children(":first");
var id = $(this).attr('id').replace("Btn", "");
$.post("/Client/ExcludeKeyword", { clientId: "1234", keywordId: id });
$(this).removeClass("exclude-button");
$(this).addClass("include-button");
text.children(":first").removeClass("disabled");
tbl.fnUpdate(td.html().replace("Exclude", "Include"), pos, 4); // <-------
text.children(":first").addClass("disabled");
tbl.fnUpdate("-excluded-", pos, 5); // <------
};
[/code]
The issue we're seeing is that after this method is run the table jumps back to the beginning of the list. So with 1000 items in the list, if you're operating on the last few rows you have to keep scrolling all the way down over and over. How do we get it to maintain it's position.
This discussion has been closed.
Replies
[code]
bl.fnUpdate("-excluded-", pos, 5, false, true);
[/code]
which will stop the DataTable redrawing (although the DOM will be updated with your new data anyway - it just stops a full redraw), but allow it to update it's internal data sources.
Allan