Loading Message inside ScrollTemplate? .......
While I was testing, I notice that the ScrollTemplate is a full container for the grid (except panels??) , so it can help us in some situations.
But is it the right place to store a Loading msg <span> ?? (could be)
I made a paging & sorting sample based on Sudhaker post:
http://www.activewidgets.com/javascript.forum.19163.6/record-level-editing-using-popup.html
Also splash by sorting in different color :-)
But is it the right place to store a Loading msg <span> ?? (could be)
I made a paging & sorting sample based on Sudhaker post:
http://www.activewidgets.com/javascript.forum.19163.6/record-level-editing-using-popup.html
Also splash by sorting in different color :-)
<html>
<head>
<title>ActiveWidgets Examples</title>
<style>body {font: 12px Tahoma}</style>
<script src="../../runtime/lib/aw.js"></script>
<link href="../../runtime/styles/xp/aw.css" rel="stylesheet"></link>
<script>
var obj = new AW.UI.Grid;
obj.setCellData(function(col, row){return col + "." + row});
obj.setHeaderText(function(col){return 'header - ' + col });
obj.setColumnCount(10);
obj.setRowCount(400); //real rows
var totalrows = obj.getRowCount();
obj.setRowCount(10); //paged rows
var pagerows = obj.getRowCount(); // paging # rows ( in this case 10)
document.write(obj);
document.write("<br>");
var button = new AW.UI.Button;
button.setControlText("Next Page");
document.write(button);
button.onControlClicked = function(){
var x = obj.getRowOffset();
if ( x < totalrows ){
this.setControlDisabled(true);
obj.LoadingMessage( true, "- Loading Page # "+ (1+(x+pagerows)/pagerows), 'lightblue');
obj.refresh();
this.setTimeout( function(){ ///--------------/// START TIMEOUT
obj.setRowOffset(x+pagerows);
obj.LoadingMessage(false);
obj.refresh();
this.setControlDisabled(false);
},700); //---------------// END TIMEOUT
}
}
obj.LoadingMessage = function( bool, msg, color ){
if (bool){
this.defineControlProperty('SavedScroll', ''); //// new property to store default scroll-template
this.setControlSavedScroll(this.getScrollTemplate().getContent('box'));
var LoadSpan = new AW.HTML.SPAN;
LoadSpan.setId('LoadingSpn')
LoadSpan.setStyle('height', '100%');
LoadSpan.setStyle('width', '100%');
LoadSpan.setStyle('background-color', color );
LoadSpan.setStyle('background-repeat', 'no-repeat');
LoadSpan.setStyle('z-index', '10000');
LoadSpan.setStyle('position', 'absolute');
LoadSpan.setStyle('opacity', '0.8');
LoadSpan.setStyle('-moz-opacity', '0.8');
LoadSpan.setStyle('filter', 'alpha(opacity=80)');
LoadSpan.setStyle('font-size', '20');
LoadSpan.setContent('html', msg + '</br>');
LoadSpan.setContent('html', LoadSpan.getContent('html')+ ', Please wait' + '</br>');
LoadSpan.setContent('html', LoadSpan.getContent('html')+'<img src=' + "../../runtime/styles/xp/combo.png" + '></img>');
this.getScrollTemplate().setContent('box',LoadSpan);
}
if (!bool){
this.getScrollTemplate().setContent('box', this.getControlSavedScroll() );
}
}
obj.onHeaderClicked = function(event, index){
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
this.setSortDirection( i == index && idir=="ascending" ? "descending" : "ascending" ,index); // draw sort indicator
this.setRowCount(totalrows); // temporaly set rowcount to all rows
this.setRowOffset(0); // restores Offset to normal
this.LoadingMessage( true, (i == index && idir=="ascending" ? '- Sorting on ' + this.getHeaderText(index) + ' ' + "descending" : '- Sorting on ' + this.getHeaderText(index) + ' ' + "ascending") , 'seashell');
this.refresh();
setTimeout( function(){ ///--------------/// START TIMEOUT
obj.sort(index, i == index && idir=="ascending" ? "descending" : "ascending" ); // sort
obj.LoadingMessage(false);
obj.setRowCount( pagerows ); // set rowcount to paged-rows again
obj.refresh();
},100); //---------------// END TIMEOUT
return true; // cancel default handler
}
</script>
</body>
</html>
Carlos
December 19,