XML and Paging

It is possible to page xml data on client side, this stuff is awesome, for those who are wondering, here is how
Include the ActiveWidgets/patches/paging1.js in your html file and..

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();
    }

that's it...

where do i get this file ActiveWidgets/patches/paging1.js ?

Under ActiveWidgets directory

DOH! Thanks for answering a stupid question...

GridType is not defined

I had problems with Satch's code so i modified a little bit and come to make it work - i have 1500 records and performance is good :

<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'>&nbsp;&nbsp;&nbsp;"+
    "<input type='image' src='_img/prev.gif' onclick='goToPage(-1)' border='0' alt='Previous Page'>&nbsp;&nbsp;&nbsp;"+
    "<span id='pageLabel'></span>&nbsp;&nbsp;&nbsp;"+
    "<input type='image' src='_img/next.gif' onclick='goToPage(1)' border='0' alt='Next Page'>&nbsp;&nbsp;&nbsp;"+
    "<input type='image' src='_img/last.gif' onclick='goToPage(Infinity)' border='0' alt='Last Page'>&nbsp;&nbsp;&nbsp;"+
    "<span id='resultsCount'></span>&nbsp;&nbsp;&nbsp;"+
    "</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>

I have more than 1500 rows in my file and with explorer it doesn't work (always no data found), how can I solve this problem? It's a xml-dataset.

Are you using virtual mode?

ActiveWidgets 1.x does not support virtual loading as far as I know. Exactly the reason for using the paging patch.....