3.2.0

Grid Scrolling and IE

When I create a new control by subclassing AW.UI.Grid, IE stops showing ScrollBars for the grid (ie the data doesnot scroll anymore). Can someone help me figure out how to get the scroll bars working again?

This is how I subclass:

var MyGrid = AW.HTML.DIV.subclass();

MyGrid.create = function() {
var obj = this.prototype;
var _super = this.superclass.prototype;

// constructor
obj.init = function(arg) {
// call parent constructor
_super.init.call(this);
this.setId("myObject");
// create ActiveWidgets data model - XML-based table
var table = new AW.XML.Table;

// provide data URL
table.setURL("companies-simple.xml");

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

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

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

grid.setColumnCount(5);

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

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

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

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

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

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


this.setContent("grid1",grid);

}
}


This is how I use this new control:

<html>
<head>
<title>ActiveWidgets Grid :: Examples</title>

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

<!-- grid format -->
<style>
.aw-grid-control {height: 200px; width: 100%; font: menu;}

.aw-column-0 {width: 80px;}
.aw-column-1 {width: 200px; background-color: threedlightshadow;}
.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 threedshadow;}
.aw-grid-row {border-bottom: 1px solid threedlightshadow;}
</style>
</head>
<body>
<script>
var myGrid = new MyGrid;
document.write(myGrid);
</script>

</body>
</html>
June 23,
Any help?
June 24,
Does anyone know the answer for this one?
June 26,
Currently AW does not allow using controls as parts of other controls (or composite html structure). The control should always be the top level element.

If you are trying to extend AW grid with additional elements, please check this example -

http://www.activewidgets.com/javascript.forum.12543.2/composite-controls-adding-more-elements.html
Alex (ActiveWidgets)
June 26,
I'm confused -- are you saying that I'm not allowed to nest an AW.UI.Grid inside an AW.HTML.DIV? 'Cause I'm doing that all over the place in a project I'm working on, and it seems to be fine. Am I breaking something and don't know it yet?
Trevor
July 12,

This topic is archived.

See also:


Back to support forum