<html>
<head>
<title>All Pages in One!</title>
<script type="text/javascript">
var offset = 2; // how many rows should be shown on each page
var rows = new Array();
rows[0] = "blah 1";
rows[1] = "blah blah";
rows[2] = "blue blah";
rows[3] = "foo blah";
rows[4] = "blah bar";
// and so on...
function QSHandler() {
this.data = [];
var qs = location.search.substr(1).split("&");
for(var i = 0; i < qs.length; i++) this.data[qs[i].split("=")[0]] = qs[i].split("=")[1];
this.QueryString = function(x) {
return this.data[x];
}
} var Request=new QSHandler();
function DOMTr(tdObj) {
var obj = document.createElement("tr");
obj.appendChild(tdObj);
return obj;
}
function DOMTd(tdHtml) {
var obj = document.createElement("td");
obj.innerHTML = tdHtml;
return obj;
}
function appendRows(start) {
if(isNaN(start)) start = 0;
var obj = document.getElementById("myTable");
var currTd, currTr;
for(var i = start; i < start + offset && typeof rows[i] != "undefined"; i++) {
currTd = DOMTd(rows[i]);
currTr = DOMTr(currTd);
obj.appendChild(currTr);
}
}
</script>
</head>
<body>
<table id="myTable">
</table>
<script type="text/javascript">
appendRows(parseInt(Request.QueryString("start")));
</script>
</body>
</html>
Hope that helps!
Happy coding! :)