annotate DataTables-1.9.4/extras/Scroller/state_saving.html @ 9:7300ed4c1481 draft default tip

Uploaded
author saskia-hiltemann
date Mon, 04 Sep 2017 10:49:00 -0400
parents ac5f9272033b
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
0
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
2 <html>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
3 <head>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
4 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
5 <link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico" />
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
6
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
7 <title>DataTables example</title>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
8 <style type="text/css">
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
9 @import "../../media/css/demo_page.css";
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
10 @import "../../media/css/demo_table.css";
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
11 @import "media/css/dataTables.scroller.css";
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
12 </style>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
13 <script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
14 <script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
15 <script type="text/javascript" language="javascript" src="media/js/dataTables.scroller.js"></script>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
16 <script type="text/javascript" charset="utf-8">
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
17 $(document).ready(function() {
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
18 var oTable = $('#example').dataTable( {
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
19 "sScrollY": "200px",
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
20 "sAjaxSource": "media/data/2500.txt",
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
21 "sDom": "frtiS",
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
22 "bDeferRender": true,
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
23 "bStateSave": true
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
24 } );
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
25 } );
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
26 </script>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
27 </head>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
28 <body id="dt_example">
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
29 <div id="container" style="width:980px">
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
30 <div class="full_width big">
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
31 Scroller with state saving
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
32 </div>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
33
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
34 <h1>Preamble</h1>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
35 <p>Scroller will automatically integrate with DataTables in order to save the scrolling position of the table, if state saving is enabled in the DataTable (bStateSave). This example shows that in practice - to demonstrate, scroll the table and then reload the page.</p>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
36
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
37 <h1>Live example</h1>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
38 <div id="demo">
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
39 <table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
40 <thead>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
41 <tr>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
42 <th>ID</th>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
43 <th>First name</th>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
44 <th>Last name</th>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
45 <th>ZIP</th>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
46 <th width="33%">Country</th>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
47 </tr>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
48 </thead>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
49 </table>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
50 </div>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
51 <div class="spacer"></div>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
52
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
53
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
54 <h1>Initialisation code</h1>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
55 <pre>$(document).ready(function() {
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
56 var oTable = $('#example').dataTable( {
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
57 "sScrollY": "200px",
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
58 "sAjaxSource": "media/data/2500.txt",
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
59 "sDom": "frtiS",
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
60 "bDeferRender": true,
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
61 "bStateSave": true
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
62 } );
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
63 } );</pre>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
64
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
65
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
66 <h1>Other examples</h1>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
67 <div class="demo_links">
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
68 <ul>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
69 <li><a href="index.html">Basic initialisation of Scroller</a></li>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
70 <li><a href="state_saving.html">State saving</a></li>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
71 <li><a href="api_scrolling.html">API - pragmatically move to a row</a></li>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
72 <li><a href="server-side_processing.html">Server-side processing with Scroller</a></li>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
73 <li><a href="large_js_source.html">50'000 rows in a table - client-side generated data</a></li>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
74 </ul>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
75 </div>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
76
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
77 </div>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
78 </body>
ac5f9272033b first upload
saskia-hiltemann
parents:
diff changeset
79 </html>