Vertical scrollbar does not show in Multilined Grid

Should one have a grid with multilined cells, the vertical scrollbar does not appear if the height of all the rows is larger than that of the grid:

Here is the script:

var myColumns = ["Column 1", "Column 2"];
var myData = [
   ["Text","<strong>Heading</strong><br />Content<br />Content"],
   ["Text","<strong>Heading</strong><br />Content<br />Content"],
   ["Text","<strong>Heading</strong><br />Content<br />Content"],
   ["Text","<strong>Heading</strong><br />Content<br />Content"],
   ["Text","<strong>Heading</strong><br />Content<br />Content"],
   ["Text","<strong>Heading</strong><br />Content<br />Content"]
];
var grid = new AW.UI.Grid;

var str = new AW.Formats.String;
var html = new AW.Formats.HTML;

grid.setHeaderText(myColumns);
grid.setCellData(myData);
grid.setCellFormat([str, html]);

grid.setRowCount(myData.length);
grid.setColumnCount(myColumns.length);

grid.setSelectionMode("single-row");

grid.getRowTemplate().setClass("text", "wrap");

document.write(grid);

Here is the CSS:

.aw-control-grid {font: menu;width: 100%; height: 350px; border: 1px inset; background: white}
.aw-grid-column {border-right: 1px solid threedlightshadow;}
.aw-grid-cell {border-right: 1px solid threedlightshadow;}
.aw-grid-row {border-bottom: 1px solid threedlightshadow;}
.aw-row-selector {text-align: center}
.aw-grid-row {
  _overflow: visible;
}

.aw-grid-row.gecko {
  display: -moz-box;
  height: auto;
  width: auto;
  min-width: 100%;
}
.aw-grid-control .aw-item-text {
    vertical-align: top;
}

How can I get the scrollbar to display?

Neil,

AW 2.0 calculates the scrolling range assuming all rows are of the same height. If you want rows to have variable height you also need to adjust scrollbars handling code.

I suppose I need to use the AW.Scroll.Bars class, but how would I go about it?

I tried setting the scroll property like so:

grid.setScrollProperty('bars','both');
grid.refresh();

I have also looped through the rows of the grid, determining their row heights (getRowHeight) and then set the Scroll Height to that of the sum of row heights like so:

var scrollHeight = 0;
for (i = 0; i < grid.getRowCount(); i++) {
  scrollHeight += grid.getRowHeight(i);
}
grid.setScrollProperty('height',scrollHeight);
grid.refresh();

But it did not work. Did you mean I have to change the actual source of the ActiveWidgets release?

First you should make getRowHeight method returning actual row height (if you set overflow:visible or height:auto on rows). And also disabling grids own code for calculating scroll range which may otherwise overwrite your value.