Setting css grid row height gives incorrect scrolling when using CSV/XML tables

When using .aw-grid-row (height: px; line-height px; } then the grid vertical scrollbar height doesn't appear to get recalculated when changing data sets via (AW.CSV.Table) CSV or (AW.XML.Table) XML.

This can be simple reproduced in example code by adding:

#myGrid .aw-grid-row {height: 50px; line-height: 50px}
.aw-strict #myGrid .aw-grid-row {height: 46px; line-height: 50px}

to either "grid data - csv/change datasets.htm" or "grid data xml/change datasets.htm" code, and subsequently observing that not all the rows are visible in dataset1 (there should 20 in CSV example).

Does anyone know a work-around to recalculate the grid scrollbars after a dataset response event has fired?

A earlier similar post (Jan 08) resolves this issue by using setRowHeight method in the table.response handler e.g

table.response = function(text) {
this._rows = text.split(/\r*\n/);
if (!this._rows[this._rows.length-1]){ this._rows.pop(); }
this._data = [];
if (this.$owner) {
this.$owner.clearScrollModel();
this.$owner.clearSelectedModel();
this.$owner.clearSortModel();
this.$owner.clearRowModel();
this.$owner.setRowCount(this.getCount() );
this.$owner.setRowHeight(50);
this.$owner.refresh(); }
obj.refresh();
};

as apparently clearRowModel() clears the height as well. So far so good, but is it possible to retrieve the row height value from the aw-grid-row height css style ?

No, you can't access the value of an inline CSS style via JavaScript.

You can only get values using a get() method if they've been set via a set() method. That is, dynamically. I don't understand why. Perhaps Alex can explain.

The grid creates a 'sample' row during the initial rendering phase, reads its height and stores in rowHeight property. This way the row height set in css is available for scrolling and size calculations.

Many thanks Alex & Antony.

Now implemented the table.response function as:

table.response = function(text)
{
this._rows = text.split(/\r*\n/);
if(!this._rows[this._rows.length-1]){this._rows.pop();}
this._data = [];
if (this.$owner)
{
this.$owner.clearScrollModel(); this.$owner.clearSelectedModel();
this.$owner.clearSortModel();
var _rowheight = this.$owner.getRowHeight() this.$owner.clearRowModel(); this.$owner.setRowCount( this.getCount() ); this.$owner.setRowHeight(_rowheight); this.$owner.refresh();
}
obj.refresh();
};


works a treat, and sorta obvious when you know the answer !

Many thanks

Alex,
We bought your product, but now we are having this problem. You said
that "The grid creates a 'sample' row during the initial rendering phase, reads its height and stores in rowHeight property. This way the row height set in css is available for scrolling and size calculations."

Please post demo scripts, we need this to be fixed ASAP!

Thanks,
Kevin