View Full Version : Safari jumps to top on row click

10 Sep 2006, 11:48 PM
I like the grid, but one thing I'm finding is that anytime I click on a row, the table scrolls up to the top. The row that I clicked is still selected, but if I have selected any rows past the first screen, it scrolls the table to the top (I assume it always scrolls to the top, but it's only apparent if I select a row past the first page). I'd like to use it in single select mode, so I don't see the need for auto scrolling (although keyboard navigation doesn't work either). If I can't fix the bug, it'd be nice to just be able to disable auto-scroll.

I'm running Safari 2.03.

Nice job on this, BTW.

11 Sep 2006, 12:41 AM
It appears I will need to get another BrowsrCamp for a day subscription and do some more Mac testing.

In the meantime you could include this workaround somewhere and it will stop row focusing in Safari (this is untested but should work):

YAHOO.ext.grid.GridView.prototype.focusRow = function(){}
YAHOO.ext.grid.GridView.prototype.ensureVisible = function(){}

That will turn off row focusing (possibly the problem) and also another piece of code I think may the culprit:

var visibleTop = element.offsetTop;
if(this.wrap.scrollTop > visibleTop){
this.wrap.scrollTop = visibleTop;

That code was added since my last Safari testing. A quick search on google took me to this page:


If you would be willing to try something for me, you could add this code somewhere and tell me if it fixes your problem:

YAHOO.ext.grid.GridView.prototype.focusRow = function(row){
if(!row) return;
var left = this.wrap.scrollLeft;
try{ // try catch for IE occasional focus bug
row.childNodes.item(0).hideFocus = true;
this.wrap.scrollLeft = left;
this.lastFocusedRow = row;
YAHOO.ext.grid.GridView.prototype.ensureVisible = function(element){
if(!element) return;
var left = this.wrap.scrollLeft;
var visibleTop = parseInt(element.offsetTop, 10);
var scrollTop = parseInt(this.wrap.scrollTop, 10);
if(scrollTop > visibleTop){
this.wrap.scrollTop = visibleTop;
this.wrap.scrollLeft = left;

Just include it anywhere after yui-ext.js and before you create your grid and it will override the prototype methods.

Please let me know if it works for you.


14 Sep 2006, 3:37 AM

just tried your code on Safari. In fact, the element.topOffset returns 0 or some very small number (but not the real offsetTop that Firefox reports).

Tried to use YAHOO.util.Dom.getY(element) but this is apparently broken for this case, too. Firefox works great.

There is a fixed Bug from February 2006.



14 Sep 2006, 3:51 AM
I am planning a hardcore Safari session before this release with BrowsrCamp. I will try to knock out this bug and others I find. Safari has to support offsetTop, so maybe it's a different, unrelated bug. I know Safari has issues with focusing elements, but I am hoping that's not what this is.

That bug looked promising until I saw it was for TR elements. The Grid doesn't actually have a table in it. It's all absolute positioned block SPANs. :)

14 Sep 2006, 6:02 AM

it doesn't have trs in it, but ygrid-row is formatted as display: table-row. Maybe, maybe,...


14 Sep 2006, 10:16 AM
Very good point. That CSS is gone in my dev version. They are all display:block now. I think the new layout code is going to fix so many "odd ball" issues.