var data = new Active.XML.Table;
var obj = new Active.Controls.Grid;
data.setText = function(value, i, j){
var node = this.getNode(i, j);
node.text = value; }
// Page returning xml
data.setURL("jsps/"+GridType+".jsp");
obj.setId(GridType);
data.request();
var columns = ["Release ID","Package Name", "First Project ID", "ECM Number", "Repository Name", "Review ID", "Review Date", "Status", "DeveloperID"];
var defaultResponse = data.response;
data.response = function(data){
defaultResponse.call(this, data);
// replace the built-in row model with the new one (defined in the patch)
obj.setModel("row", new Active.Rows.Page);
obj.setProperty("row/count", this.getCount());
obj.setProperty("column/count", 9);
obj.setProperty("column/texts", columns);
// set page size
obj.setProperty("row/pageSize", 10);
goToPage(0,obj,GridType+'Lbl');
}
function goToPage(delta,obj,lbl){
var rowCount = obj.getProperty("row/count");
var count = obj.getProperty("row/pageCount");
var number = obj.getProperty("row/pageNumber");
number += delta;
if (number < 0) {number = 0}
if (number > count-1) {number = count-1}
document.getElementById(lbl).innerHTML = "Page <b>" + (number + 1) + "</b> of <b>" + count + "</b>"
document.getElementById(lbl+'Rows').innerHTML = "Total Rows <b>"+ rowCount +"</b>";
obj.setProperty("row/pageNumber", number);
obj.refresh();
}
<script>
// create ActiveWidgets data model - XML-based table
var table = new Active.XML.Table;
var obj = new Active.Controls.Grid;
table.setText = function(value, i, j){
var node = this.getNode(i, j);
node.text = value; }
// provide data URL
table.setURL("data.xml");
// start asyncronous data retrieval
table.request();
// define column labels
var columns = ["column1", "column2", "column3", "column4"];
// provide external model as a grid data source
obj.setDataModel(table);
// Write navigation bar once table is populated (Active.XML.Table retrieves data asynchronously)
var resultsCount;
var defaultResponse = table.response;
table.response = function(data){
var maxrows = 25;
defaultResponse.call(table, data);
// replace the built-in row model with the new one (defined in the patch)
obj.setModel("row", new Active.Rows.Page);
resultsCount = this.getCount();
obj.setProperty("row/count", resultsCount);
obj.setProperty("column/count", columns.length);
obj.setProperty("column/texts", columns);
document.getElementById('resultsCount').innerHTML = "("+ resultsCount + " result(s) found)";
// set page size
obj.setProperty("row/pageSize", maxrows);
goToPage(0);
}
// alternate background rows
function myColor(){
var value = this.getProperty("row/order");
return (value & 1) ? "#e9e9e9" : "#fff";
}
obj.getTemplate("row", 0).setStyle("background-color", myColor);
// override sort function
var _sort = obj.sort;
obj.sort = function(index, direction){
_sort.call(this, index, direction);
document.getElementById('pageLabel').innerHTML = "Page " + 1 + " of " + obj.getProperty("row/pageCount") + " ";
}
document.write(
"<div id='nav' style='visibility:hidden'>"+
"<input type='image' src='_img/first.gif' onclick='goToPage(-Infinity)' border='0' alt='First Page'> "+
"<input type='image' src='_img/prev.gif' onclick='goToPage(-1)' border='0' alt='Previous Page'> "+
"<span id='pageLabel'></span> "+
"<input type='image' src='_img/next.gif' onclick='goToPage(1)' border='0' alt='Next Page'> "+
"<input type='image' src='_img/last.gif' onclick='goToPage(Infinity)' border='0' alt='Last Page'> "+
"<span id='resultsCount'></span> "+
"</div>\n");
// write grid html to the page
document.write(obj);
</script>
<!-- button click handler -->
<script>
function goToPage(delta){
var count = obj.getProperty("row/pageCount");
var number = obj.getProperty("row/pageNumber");
number += delta;
if (number < 0) {number = 0}
if (number > count-1) {number = count-1}
document.getElementById('pageLabel').innerHTML = "Page " + (number + 1) + " of " + count + " ";
obj.setProperty("row/pageNumber", number);
obj.refresh();
document.getElementById("nav").style.visibility = "visible";
}
</script>
This topic is archived.