3.2.0

setRowHeight causing missing rows at base of grid

Alex,

Something new with 2.5.1 - using setRowHeight to set a specific height for all the rows causes the lower rows of a grid to be unavailable. i.e. you can't scroll down to them. Basically the same in both IE and FireFox.

Also seems to affect whether the vertical scroll bar appears - i.e. if only a couple of rows are missing it doesn't appear.

I've had a look in _overflow.fs but not sure which bits to change :)

Thanks for any advice.

Charles.
Charles Dean
January 22,
I cannot reproduce this - works fine for me. Could you post an example?

Something like this might happen if you are using 'strict' doctype and you are adding a row border without reducing the padding. But it is the same in 2.0 and 2.5.
Alex (ActiveWidgets)
January 22,
Alex,

Sorry for the delay - it's taken me a while to cut down the rather large codebase involved. I've included the code below.

Firefox: (regardless of use of setRowHeight)
75% of the time the lower 3 rows can not be scrolled to. In 25% of cases after the data has displayed, half a second later it refreshes and the scroll bars repaint - then one can scroll to the base.

IE:
The issue above occurs only if setRowHeight has been used.

IE & Firefox:
In addition if the width is too large a horizontal scroll bar appears, however if it's too small it doesn't - the wrong way round :)

Thanks

Charles.
Note: IE6/Firefox2/AW2.5.1

<!-- this comment puts all versions of Internet Explorer into "reliable mode." -->
<% Response.Buffer = True %>
<!--#include virtual="/Lib/common.asp"-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Grid Testing Window</title>
<link href="/style.css" rel="stylesheet" type="text/css" />
<script src="/Lib/_AW/aw.js"></script>
<link href="/Lib/_AW/aw.css" rel="stylesheet"></link>
</head>
<style>
    #defaultgrid {font-size:8pt; border-top: 1px solid black;}
    #defaultgrid .aw-edit-cell { border:1px solid #999999;}
    #defaultgrid .aw-grid-row {border-bottom: 1px solid threedlightshadow; text-align: left;}
    #defaultgrid .aw-alternate-even {background: #fff;}
    #defaultgrid .aw-alternate-odd {background: #ddd;}
    #defaultgrid .aw-grid-cell {border-right:1px solid threedlightshadow; padding-right:3px;}
    #defaultgrid .aw-column-0 {font-weight: bold; background: #ebeadb;}
    #defaultgrid .aw-rows-selected {color:black; font-weight:bold; background:#ebeadb;}
    #defaultgrid .aw-cells-selected {color:black; font-weight:bold; background:#ebeadb;}
    #defaultgrid .aw-grid-header {text-align:center; color:black; font-weight:bold; background:#ebeadb; }
    #defaultgrid .aw-header-0 .aw-mouseover-header {color:#890000;}
    #defaultgrid .aw-sort-descending .aw-grid-sort { background:none}
    #defaultgrid .aw-sort-ascending .aw-grid-sort { background:none}
</style>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="385" border="0" cellpadding="0" cellspacing="0" class="std_black">
    <tr><td><script>
    
        var obj = new AW.Grid.Extended
        obj.setSize(385,200);
        obj.setId("defaultgrid");
        obj.setVirtualMode(false);
        obj.setHeaderCount(1);
        obj.setSelectorVisible(false);
        obj.setSelectionMode("single-cell");
        //obj.setRowHeight(20);
        obj.setHeaderText(['col1','col2','col3','col4','col5']);
        obj.setColumnCount(5);
        obj.setColumnWidth([40,80,80,80,80]);
        document.write(obj);
        
        // Data
        var table = new AW.CSV.Table;
        table.setURL('blah blah')
        table.response = function(text) {
            this._rows = text.split(/\r*\n/);
            if (!this._rows[this._rows.length-1]){ this._rows.pop(); }
            this._data = []; var nn = this.getCount() -12 // Note: deliberate !!
            if (this.$owner) {
                this.$owner.clearScrollModel();
                this.$owner.clearSelectedModel();
                this.$owner.clearSortModel();
                this.$owner.clearRowModel();
                this.$owner.setRowCount(nn);
                this.$owner.refresh(); }
            obj.refresh();
        };
        table.request();
        obj.setCellModel(table);
        
    </script></td></tr>
</table>		
</body>
</html>
Charles Dean
January 22,
Most likely the problem is in this line -

#defaultgrid .aw-grid-row {
   border-bottom: 1px solid threedlightshadow; 
   text-align: left;
}


When you add 1px border you also have to reduce padding by 1px (in 'standard' box model). Should be

#defaultgrid .aw-grid-row {
   border-bottom: 1px solid threedlightshadow; 
   padding-bottom: 3px; 
   text-align: left;
}


Alex (ActiveWidgets)
January 23,
Alex,

Thanks for the advice. Unfortunately no luck. Still getting the problem intermittently in Firefox and all the time in IE with use of setRowHeight.

I'd be grateful for any other thoughts.

Thanks

Charles.
Charles Dean
January 28,
First, you should decide whether you want to run the page in 'standards-compliant' or quirks mode. Currently your doctype is ignored in IE because the doctype element should be the first one on the page. As the result the page runs in 'quirks' mode in IE (doctype ignored) and in 'standards-compliant' in Firefox (according to the doctype). The padding/border correction (as in my previous post) is necessary only for 'standards-compliant' mode.

There is also a bug in your (and my) code - call to clearRowModel() clears row height as well. Correct code should look like -

...
this.$owner.clearRowModel();
this.$owner.setRowCount(nn);
this.$owner.setRowHeight(...);
...
Alex (ActiveWidgets)
January 28,
Genius. Thanks very much Alex, all works perfectly.

Charles.
Charles Dean
January 28,

This topic is archived.

See also:


Back to support forum