3.2.0
Forum Demo Guide API Store

Blank page during paging

If I do a sort on any columns and then try to do a page next to get the next 10 rows I am getting blank rows and NaN on the left side.

Attached is the code.

<html>
<head>
<title>ActiveWidgets Grid :: Examples</title>
<style> body, html {margin:0px; padding: 0px; overflow: hidden;} </style>

<!-- ActiveWidgets stylesheet and scripts -->
<link href="../../runtime/styles/xp/aw.css" rel="stylesheet" type="text/css" ></link>
<script src="../../runtime/lib/aw.js"></script>

<!-- grid format -->
<style>
.aw-grid-control {height: 100%; width: 100%; margin: 0px; border: none; font: menu;}
.aw-row-selector {text-align: center}

.aw-column-0 {width: 80px;}
.aw-column-1 {width: 200px;}
.aw-column-2 {text-align: right;}
.aw-column-3 {text-align: right;}
.aw-column-4 {text-align: right;}

.aw-grid-cell {border-right: 1px solid threedlightshadow;}
.aw-grid-row {border-bottom: 1px solid threedlightshadow;}
</style>
<style>
.aw-alternate-even {
background: #E1F5CE;
}

.aw-alternate-odd {
background: #ffffff;


.aw-mouseover-row {background: #ddeeff;}

}


</style>
<!-- grid data -->
<script>






var myColumns = ["Hazard Number", "Rec #" , "Tour Date", "Dept. ", "Union Rep ", "Mgmt. Tour Rep", "Status", "Haz Assessment", "Days Open","Days Past Due", "Hazard Description" ];

var myData=[
["PDA","4012000680","06/23/06","0150","L, THERESA","N/A","OPEN","High","","","GUARD NEEDS TO BE FIXED"]
,["PDA","4012000679","06/23/06","9150","L, THERESA","N/A","OPEN","High","","","CONTAINER NOT LABELED"]
,["PDA","4012000678","06/23/06","0150","L, THERESA","N/A","OPEN","Medium","","","CONTAINER NOT LABELED"]
,["PDA","4012000677","06/22/06","0150","L, THERESA","N/A","OPEN","Medium","1","","GUARD NEEDS TO BE FIXED"]
,["PDA","4012000676","06/22/06","0150","L, THERESA","N/A","OPEN","Medium","1","","CONTAINER NOT LABELED"]
,["PDA","4012000675","06/22/06","9130","L, THERESA","N/A","CORR","Medium","1","","UNIDENTIFIED PARTS"]
,["PDA","4012000674","06/22/06","9130","L, THERESA","N/A","OPEN","High","1","","UNIDENTIFIED PARTS"]
,["PDA","4012000673","06/22/06","0150","L, THERESA","N/A","OPEN","High","1","","GUARD NEEDS TO BE FIXED"]
,["PDA","4012000672","06/20/06","0150","L, THERESA","N/A","OPEN","Medium","3","","BROKEN INTERLOCK"]
,["PDA","4012000671","06/20/06","0150","L, THERESA","N/A","OPEN","Medium","3","","GHYTTGGFTTG"]
,["PDA","4012000670","06/19/06","0150","L, THERESA","N/A","OPEN","Medium","4","","FLAT TIRE"]
,["PDA","4012000669","06/19/06","0150","L, THERESA","N/A","OPEN","Medium","4","","CONTAINER NOT LABELED"]
,["PDA","4012000668","06/16/06","0150","L, THERESA","N/A","OPEN","Medium","7","","BROKEN INTERLOCK"]
,["TEST","4012000667","06/16/06","0000","W, JAMAR","G, DANETTE","OPEN","Medium","7","","Testing"]
,["PDA","4012000666","06/14/06","0150","L, THERESA","N/A","OPEN","Medium","9","2","BROKEN INTERLOCK"]
,["PDA","4012000665","06/14/06","0150","L, THERESA","N/A","OPEN","Medium","9","2","BROKEN INTERLOCK"]
,["PDA","4012000664","06/14/06","0150","L, THERESA","N/A","OPEN","Medium","9","2","BROKEN INTERLOCK"]
,["PDA","4012000658","06/09/06","0150","L, THERESA","N/A","OPEN","Medium","14","7","BROKEN INTERLOCK"]
,["PDA","4012000657","06/09/06","0150","L, THERESA","N/A","OPEN","Medium","14","7","BROKEN INTERLOCK"]
,["PDA","4012000656","06/09/06","0150","L, THERESA","N/A","OPEN","Low","14","","BROKEN INTERLOCK"]
,["PDA","4012000655","06/09/06","0150","L, THERESA","N/A","OPEN","Medium","14","7","BROKEN INTERLOCK"]
,["PDA","4012000654","06/09/06","0150","L, THERESA","N/A","OPEN","Medium","14","7","BROKEN INTERLOCK"]
,["PDA","4012000653","06/09/06","0150","L, THERESA","N/A","OPEN","Medium","14","7","BROKEN INTERLOCK"]
,["PDA","4012000652","06/09/06","0150","L, THERESA","N/A","OPEN","Low","14","","BROKEN INTERLOCK"]
,["PDA","4012000651","06/05/06","0150","L, THERESA","N/A","OPEN","Medium","18","11","BROKEN INTERLOCK"]
,["PDA","4012000648","05/19/06","0150","L, THERESA","N/A","OPEN","Medium","35","28","BROKEN INTERLOCK"]
,["PDA","4012000647","05/19/06","0150","L, THERESA","N/A","OPEN","Medium","35","28","UNIDENTIFIED PARTS"]
,["PDA","4012000646","05/19/06","0150","L, THERESA","N/A","OPEN","Medium","35","28","GUARD MISSING"]
,["PDA","4012000645","05/19/06","0150","L, THERESA","N/A","OPEN","Medium","35","28","GUARD MISSING"]
,["PDA","4012000644","05/19/06","0150","L, THERESA","N/A","OPEN","High","35","33","TEST 19"]
,["PDA","4012000643","05/18/06","0150","L, THERESA","N/A","OPEN","High","36","34","SFYEUTET"]
,["PDA","4012000642","05/18/06","0150","L, THERESA","N/A","CORR","Medium","36","29","GUARD NEEDS TO BE FIXED"]
,["PDA","4012000641","05/18/06","0150","L, THERESA","N/A","OPEN","High","36","34","ERTS"]
,["PDA","4012000640","05/18/06","0150","L, THERESA","N/A","OPEN","Medium","36","29","BROKEN INTERLOCK"]
,["12Test","4012000639","05/17/06","0500","C, ANGELA","W, JAMAR","OPEN","Low","37","7","test"]
,["PDA","4012000638","05/16/06","0150","L, THERESA","N/A","OPEN","Medium","38","31","BROKEN INTERLOCK"]
,["test111","4012000632","05/02/06","1480","G, DANETTE","N/A","OPEN","High","52","50","test"]
,["12222222","4012000631","04/28/06","1480","G, DANETTE","N/A","OPEN","Low","56","26","testr"]
,["PDA","4012000630","04/25/06","0150","N/A","L, THERESA","OPEN","Medium","59","52","BROKEN INTERLOCK"]
,["04252006","4012000629","04/25/06","0200","W, JAMAR","G, DANETTE","OPEN","Low","59","29","test 2"]
,["T11111","4012000628","04/25/06","1480","G, DANETTE","N/A","OPEN","High","59","57","TEST"]
,["t00101","4012000627","04/25/06","1480","C, ANGELA","N/A","OPEN","High","59","57","test"]
,["04182006","4012000625","04/18/06","0200","BROWN, GENIQUE","W, JAMAR","OPEN","Low","66","36","test"]
,["","4012000122","02/04/04","3410","N/A","N/A","CORR","Low","870","840","FULL DESCRITPTION"]
,["","4012000121","01/26/04","NA","N/A","N/A","RESUB","High","879","877","Full desc"]
,["","4012000105","12/03/03","9150","N/A","N/A","CORR","Medium","933","926","Test two"]
,["093020041152","N/A","09/30/04","3410","N/A","N/A","OPEN","Low","631","601","TESTING AFTER FIXING MEMO REC"]
];

</script>
</head>
<body>
<script>
document.write("<table><tr><td>");

var prevbutton = new AW.UI.Button;
prevbutton.setControlText("Prev");
document.write(prevbutton);

document.write("</td><td>");


var nextbutton = new AW.UI.Button;
nextbutton.setControlText("Next");
document.write(nextbutton);

document.write("</td></tr></table>");

// create ActiveWidgets Grid javascript object
var obj = new AW.UI.Grid;

// define data formats
var str = new AW.Formats.String;
var num = new AW.Formats.Number;
var date1 = new AW.Formats.Date;

obj.setCellFormat([str, str, date1, str, str, str, str, str, num, num,str]);

// provide cells and headers text
obj.setCellText(myData);
obj.setHeaderText(myColumns);

// set number of rows/columns
obj.setRowCount(myData.length);
obj.setColumnCount(11);

// enable row selectors
obj.setSelectorVisible(true);
obj.setSelectorText(function(i){return this.getRowPosition(i)+1});

// set headers width/height
obj.setSelectorWidth(28);
obj.setHeaderHeight(20);

// set row selection
obj.setSelectionMode("single-row");

// set click action handler
//obj.onCellClicked = function(event, col, row){window.status = this.getCellText(col, row)};

function triplets(){
return this.getRowProperty("position") % 2 ? "even" : "odd";
}

obj.getRowTemplate().setClass("alternate", triplets);
var totalrows = obj.getRowCount();
obj.setRowCount(myData.length);
obj.setRowCount(10);


// write grid html to the page
document.write(obj);




nextbutton.onControlClicked = function(){
var x = obj.getRowOffset();
if ( x < totalrows )
{ obj.setRowOffset(x+10);
obj.refresh();
}
}

prevbutton.onControlClicked = function(){
var x = obj.getRowOffset();
if ( x > 0 )
{ obj.setRowOffset(x-10);
obj.refresh();
}
}

obj.onRowDoubleClicked = function(event, rowIndex){
alert(document.location.href = "/best/WSOT_EditPocketCard.jsp?HazardNumber="+this.getCellText(1,rowIndex)+"&cmd=update");
}


obj.onRowMouseOver = function(event, row){};




</script>
</body>
</html>

Any help is appreciated
Ben
August 19,
Ben,

the current sort method does not work with this type of paging - the sort method (incorrectly) tries to sort only items between row offset and row offset + row count, so the row indices array not longer extends beyond this point.
Alex (ActiveWidgets)
August 21,
I found a small workaround ( for Array-Data-Model Only ), that
uses the trick ( restoring RowCount to a normal grid state just before sort ) , so it delays some the sorting, but seems to work.
I took this sample from a thread about restoring sort indicator posted by Alex.
For now, on rest Data-Models, I am using a second "hidden" grid to do it.
HTH 
var pagerows = obj.getRowCount();  // paging # rows ( in this case 10)

obj.onHeaderClicked = function(event, index){ 
setTimeout( function(){  ///--------------/// START TIMEOUT 

 var i = obj.getSortColumn();                         // get previous sorted-Column 
 var idir = obj.getSortDirection(i);                   // get previous sort-Direction
 if (obj.getSortDirection(i)) { obj.setSortDirection("", i); }         //    clean previous sort indicator
    
obj.setRowCount(totalrows);
obj.setRowOffset(0);                  // restores Offset to normal
   
    //    sort 
if (i == index ) {   obj.sort(index, idir=="ascending" ? "descending" : "ascending" ); }
else {   obj.sort(index, "ascending" ); }                                  

// draw sort indicator
if (i == index ) {   obj.setSortDirection( idir=="ascending" ? "descending" : "ascending" ,index); 
}
else {  obj.setSortDirection( "ascending", index); 
}  

///  go to first page after sort  
obj.setRowCount(  pagerows );  
obj.getRowsTemplate().refresh();    //or... obj.refresh();

},100);  //---------------// END TIMEOUT
 return true; // cancel default handler 
    }
Carlos
August 21,
Alex, Are you planning to release a patch for this. We need this to convert code from 1.0 to 2.0.
Ben
August 22,
Carlos, You the Man..... Its works now.
Ben
August 22,
Great solution carlos
Suma
April 18,

This topic is archived.

See also:

PAGING with Version 2.0 K.P (28)
when will ajax paging be available? Joe Hudson (13)
grid go blank when scrolling (10)
Scrolling in grid in Firefox causes the whole page to scroll to the top Maggie M (9)
How to avoid loading aw.js at each page thierry (8)
AW Grid 2.0.1 is blank on IE7 Dave Hulting (8)
blank table after asynchronous request Gianni Luppi (8)
Blank page no results Pascale (3)
Page scrolls to top when I scroll in grid - Firefox only Fionn (6)
Object Undefined when loading page or selecting checkbox Chris (6)

Back to support forum

Search

New Data Grid
Angular Data Grid
React Data Grid
Vue Data Grid
Svelte Data Grid

Version 2

Looking for AW 2.6 ?
The old site is here.

ActiveWidgets is a javascript library for creating user interfaces. It offers excellent performance for complex screens while staying simple, compact and easy to learn. Deployed by thousands of commercial customers in more than 70 countries worldwide.

Copyright © ActiveWidgets 2021
Getting Started
 
Sample Code API Reference Support Forum Prices & Licensing
 
Contact Us