AW 2.5.2 scrolling behavior after grid is resized

Hello.

With the current version AW 2.5.2, I can't seem to adjust the scrolling behavior after I change the height of a grid.
Previously I was using AW 2.0.2 and when I re-sized a grid, the scrolling functionality automatically adjusted correctly to reflect the new grid height.

Here is a page that demonstrates this:
(modified AW 2.5.2 example grid data - xml, change datasets.htm requires the basic1.xml file)

If it is displayed using the AW 2.0.2 version, the scroll bars adjust automatically when the grid is resized.
If it is displayed using the AW 2.5.2 version, the scrolling behavior works, but not as well.

Any suggestions?

Thanks.
JK

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ActiveWidgets Examples</title>


<style type="text/css">
.aw-quirks * {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

body {font: 12px Tahoma}
</style>


<script src="../../Site_SMS/js/AW/runtime/lib/aw.js"></script>
<link href="../../Site_SMS/js/AW/runtime/styles/xp/aw.css" rel="stylesheet" />


<style type="text/css">
#myGrid {height: 200px; width: 500px;}
#myGrid .aw-row-selector {text-align: center}

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

#myGrid .aw-grid-row {border-bottom: 1px solid threedlightshadow;}
#myGrid .aw-grid-cell {border-right: 1px solid threedlightshadow;}

/* box model fix for strict doctypes, safari */
.aw-strict #myGrid .aw-grid-cell {padding-right: 3px;}
.aw-strict #myGrid .aw-grid-row {padding-bottom: 3px;}

</style>
</head>
<body>
<script type="text/javascript">

// create ActiveWidgets data model - XML-based table
var table = new AW.XML.Table;

// provide data URL
table.setURL("basic1.xml");

// start asynchronous data retrieval
table.request();

// define column labels
var columns = ["Ticker", "Company Name", "Market Cap.", "$ Sales", "Employees"];

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

// assign unique id for the grid element
obj.setId("myGrid");

// number of columns
obj.setColumnCount(5);

// provide column labels
obj.setHeaderText(columns);

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

// set data formats
obj.setCellFormat([str, str, num, num, num]);

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

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

// assign external 'data model'
obj.setCellModel(table);

obj.setVirtualMode(false);

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

function load(url){
table.setURL(url);
table.request();
}

</script>

<script type="text/javascript">
function resizeGridHeight( h ) {

obj.setStyle('height', h + 'px');

//obj.raiseEvent("adjustScrollWidth");
//obj.raiseEvent("adjustScrollHeight");
//obj.raiseEvent("adjustScrollBars");

obj.refresh();
}
</script>

<br><br>


<button onClick="resizeGridHeight(500);">Resize 500</button>
<button onClick="resizeGridHeight(100);">Resize 100</button>

</body>
</html>

Jim K.

July 17,

P.S.
After I added obj.setScrollTop(0); to the resizeGridHeight() function it worked for IE but not for FF2.

JK

Jim K.

July 17,

Try changing your resize function this way -

function resizeGridHeight( h ) {

  obj.setStyle('height', h + 'px');
  obj.setContentHeight(h - 4, "total");
  obj.refresh();
}

Alex (ActiveWidgets)

July 18,

Yes! - this works for me, thanks again.
JK

Jim K.

July 18,

This topic is archived.

AW 2.5.2 scrolling behavior after grid is resized

See also:

Search

New Data Grid

Version 2