Clear stateSave when page reloads
Clear stateSave when page reloads
JonasP
Posts: 5Questions: 2Answers: 0
Is it possible to clear/drop stateSave when a page is reloaded?
I found the function table.state.clear(); but i dont know how to code it to work.
Jonas
<!DOCTYPE HTML>
<html lang="sv-se">
<head>
<meta http-equiv="Content-type" content="text/html; charset="iso-8859-1">
<title>Brf Info</title>
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto">
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap.min.css">
<style type="text/css" class="init"></style>
<link rel="stylesheet" type="text/css" href="Styles/Main2017.css" />
<script type="text/javascript" language="javascript" src="JavaScript/JavaScript.js"></script>
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap.min.js"></script>
<script type="text/javascript" class="init" language="javascript">
$(document).ready(function() {
$('#foretaglista').DataTable({
stateSave: true,
order: [],
columnDefs: [{bSortable: false, targets: [4]}],
lengthMenu: [ 25, 50, 100, 150 ],
language: {
"sEmptyTable": "Tabellen innehåller ingen data",
"sInfo": "Visar _START_ till _END_ av totalt _TOTAL_ rader",
"sInfoEmpty": "Visar 0 till 0 av totalt 0 rader",
"sInfoFiltered": "(filtrerade från totalt _MAX_ rader)",
"sInfoPostFix": "",
"sInfoThousands": " ",
"sLengthMenu": "Visa _MENU_ rader",
"sLoadingRecords": "Laddar...",
"sProcessing": "Bearbetar...",
"sSearch": "Sök:",
"sZeroRecords": "Hittade inga matchande resultat",
"oPaginate": {
"sFirst": "Första",
"sLast": "Sista",
"sNext": "Nästa",
"sPrevious": "Föregående"
},
"oAria": {
"sSortAscending": ": aktivera för att sortera kolumnen i stigande ordning",
"sSortDescending": ": aktivera för att sortera kolumnen i fallande ordning"
}
}
});
} );
</script>
</head>
This discussion has been closed.
Answers
Hi @JonasP ,
If you want to clear the state after each draw, you could add it into the
drawCallback
, something like this:However, I'm not sure why you'd want to, as that would remove the benefit of the stateSave functionality!
Cheers,
Colin
Hi Colins and thanks for your answer. Im sorry but this didn't work out - all extra table functions sortorder, pagning dose not show - perhaps i miss some code.
Ill try to explain the issue in more detail.
Click on any brand to list cars
Chrysler | Ferrari | Volvo
Here comes the outstanding sortTable
So far so good !!!!! (stateSave: true, works fine.)
But now comes the problem.
The user selects Volvo and the table fill with 150 Volvo cars. The issue is that sortorder now is build year not sortorder car name.
I really need data to be sorted by default everytime a user selects new data to the table. // Cheers - Jonas
Hi @JonasP ,
That should work, look at the example here, I suspect something else is wrong.
However, don't do in the
drawCallback
as that would lose the state whenever the table is drawn. I would do in aclick
event handle for the cars. You could give them all the same class, and just have a single click handler. I've also added that in the example above.Hope that does the trick,
Cheers,
Colin
I have created a test table - hittabrf.se/hittabrf_labb/testsorttables.asp?Dataset=Data1
The code
drawCallback: function() {
this.api().state.clear();
seems to disable stateSave=true so the user dont get back to the right spot.
I have no skills in JavaScript and i don't know what i'm doing right now....
I dont know if its possible when page loads: