:: Forum >>

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 :-)
<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
Wednesday, December 19, 2007
Hi carlos...
ive working on a solution for you and i think i found an nice way to do.
Maybe alex can help us to create a perfect solution for this.
Here my example:

http://aw.pimpas.net/components/tests/grid_loading_msg.html

However, the solution works only in firefox, in IE7 the message dont appear, dunno why.

Well, that is, hope this help you Carlos.

Cya. Happy New Year.
Paulo Cesar (PC from Brazil)
Tuesday, January 1, 2008

This topic is archived.


Back to support forum

Forum search