Dojo datagrid will make the page "jump" when changing the sort

Question

I have a Dojo Datagrid on one of my pages (which contains more content), and the following problem occurs: As soon as I click on the column heading to change the sorting, the page will jump up as if I clicked on some HTML anchor.

It is funny that when a page is navigated, the grid will only show the first two lines after it has jumped, instead of (for example) starting the grid at the top of the page after the jump, which is the expected behavior if the anchor is used.

The problem occurs in different browsers (tested: Firefox 3.6, Opera 10, IE6), so I think it could be a Dojo -problem / -bug problem.

Any ideas for this annoying behavior to stop?

Hi, Select0r

PS: this seems to describe a similar problem, only for jQuery (and, unfortunately, without a solution too)

Answer 1

There are several forces in the DataGrid and the base _Grid that can reduce the grid only to the height of its header line between the samples, and then grow again. If you encounter a behavior that you specifically described by scrolling it at the bottom of the page, your browser most likely “scrolls” (so that its lower part of the viewport coincides with the new lower edge of the page), but then when the table loads new data and resizing again, your browser is still “scrolling”.

DataGrid _Grid. :

• DataGrid _clearData, updateRowCount (0) (.. 0 , )

• _Grid _resize , heightNode height '', _autoHeight (, , , autoHeight , >= rowCount)

, DataGrid._clearData _Grid._resize ; , , DataGrid . , .

dojo.provide('my.DataGrid');

dojo.declare('my.DataGrid', dojox.grid.DataGrid, {
  updateRowCount: function(inRowCount) {
    if (inRowCount > 0) { //ignore requests to set rowCount to 0
      this.inherited(arguments);
    }
  },
  _resize: function(changeSize, resultSize) {
    if (this._autoHeight) {
      //sizeblink workaround
      var _viewsNode = this.viewsNode;
      this.viewsNode = {style: {height: ''}}; //_Grid._resize crash dummy
      this.inherited(arguments);
      this.viewsNode = _viewsNode;
      //call post-functions again with node properly hooked
      this.adaptWidth();
      this.adaptHeight();
      this.postresize();
    } else {
      this.inherited(arguments);
    }
  }
});
//carry over DataGrid custom markupFactory, otherwise declarative won't work
my.DataGrid.markupFactory = dojox.grid.DataGrid.markupFactory;

, , , , . , dojo trac...

Answer 2

: , CnEY , , DataGrid 0 , .

DataGrid DIV, , , "" .

, , DIV , ​​/ JavaScript, - ( , CnEY).