 |
example-ajax.html - jscancer - Javascript crap (relatively small) |
 |
git clone git://git.codemadness.org/jscancer |
 |
Log |
|
Files |
|
Refs |
|
README |
|
LICENSE |
|
--- |
|
example-ajax.html (2534B) |
|
--- |
|
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.… |
|
2 <html> |
|
3 <head> |
|
4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-… |
|
5 <title>jsdatatable AJAX</title> |
|
6 <link rel="stylesheet" type="text/css" href="datatable.css" /> |
|
7 </head> |
|
8 <body> |
|
9 |
|
10 <input type="search" class="filter-text" value="" placeholder="Filter...… |
|
11 <br/> |
|
12 |
|
13 <!--<table id="datatable" class="datatable" style="display: none" data-l… |
|
14 <table id="datatable" class="datatable" cellpadding="0" cellspacing="0" … |
|
15 <thead> |
|
16 <tr> |
|
17 <th data-parse="int">#</th> |
|
18 <th class="sort-disabled" data-sortable="false" data-parse="int"… |
|
19 <th data-parse="float"></th> |
|
20 <th data-parse="float">€</th> |
|
21 <th data-parse="int" data-filterable="false">numbers (disabled f… |
|
22 <th>Description</th> |
|
23 <th data-parse="int">yyyy-mm-dd</th> |
|
24 </tr> |
|
25 </thead> |
|
26 <tbody> |
|
27 </tbody> |
|
28 </table> |
|
29 |
|
30 <script type="text/javascript" src="datatable.js"></script> |
|
31 <script type="text/javascript"> |
|
32 |
|
33 function datatable_load_data(d, data) { |
|
34 // NOTE: assumes each tr has only "<td>" childnodes. |
|
35 for (var i = 0; i < data.length; i++) { |
|
36 var values = [], fv = []; |
|
37 var tr = document.createElement("tr"); |
|
38 for (var j = 0; j < data[i].length; j++) { |
|
39 var td = document.createElement("td"), v, vd, vs; |
|
40 // array with [ actual value case-insensitive, "… |
|
41 if (data[i][j].constructor === Array) { |
|
42 v = data[i][j][0]; |
|
43 vd = data[i][j][1]; |
|
44 vs = String(v); |
|
45 td.setAttribute("data-value", vs); |
|
46 fv.push([ vs.toLowerCase(), vd.toLowerCa… |
|
47 } else { |
|
48 v = data[i][j]; |
|
49 vd = String(v); |
|
50 fv.push([ vd.toLowerCase() ]); |
|
51 } |
|
52 td.textContent = vd; |
|
53 tr.appendChild(td); |
|
54 values.push(d.cols[j].parsefn(v)); |
|
55 } |
|
56 d.data_raw.push({ |
|
57 filtervalues: fv, |
|
58 tr: tr, |
|
59 values: values |
|
60 }); |
|
61 } |
|
62 return d.data = d.data_raw; |
|
63 } |
|
64 |
|
65 var ds = datatable_autoload(); |
|
66 |
|
67 var x = new(XMLHttpRequest); |
|
68 x.onreadystatechange = function () { |
|
69 if (x.readyState != 4 || [ 0, 200 ].indexOf(x.status) == -1) |
|
70 return; |
|
71 var rdata = null; |
|
72 try { |
|
73 rdata = JSON.parse(x.responseText); |
|
74 } catch(e) { |
|
75 return; |
|
76 } |
|
77 var d = ds[0]; |
|
78 d.display(datatable_load_data(d, rdata.data)); |
|
79 |
|
80 }; |
|
81 x.open("GET", "example-ajax-data.json?t=" + String((new(Date)).getTime()… |
|
82 x.setRequestHeader("X-Requested-With", "XMLHttpRequest"); |
|
83 x.timeout = 30000; |
|
84 try { |
|
85 x.send(); |
|
86 } catch(e) { |
|
87 } |
|
88 </script> |
|
89 |
|
90 </body> |
|
91 </html> |
