I am adding rows via JavaScript into an UltraWebGrid with no paging (other than the slider). While adding new rows within the visible portion of the grid, all appears fine. Once a new row is added at the bottom of the grid, the new row's cell editing occurs below the grid's frame. Subsequent row additions cause each new row's cell editing to creep down the page. Also, the grid's vertical slider is not positioned at the very bottom even though this is the last row. It is as if the new row's cell editor has a miscalculated vertical offset because of an incorrectly inferred grid height.
I am using CLR3.5 version 10.1 and the grid is nested within a table (for positioning), an UpdatePanel, a ContentPane and (finally) a Master Page.
Any thoughts on how this is happening and how to avoid it? I have used various combinations of Cell/Row scrollToView() calls to no avail.
A little further detai:
The grid is performing an AfterCellUpdate postback to the server in order to retrieve values for the current row's cells based upon a cell's value entered. If the postback is not performed, the grid behaves perfectly. That is, rows are added and the cell's editor is properly positioned within the frame of the grid. If the postback is allowed to occur (even if the postback performs no operations), rows are added to the grid; however cell editing of the first column creeps down the page as described in the original post -- each subsequent row addition beyond those that fill the visible portion of the grid cause the grid's cell editor to move down the page.
The callback is necessary in order to retrieve cell values upon data entry.
Any suggestions, hacks, work-arounds?
It appears that the problem was the client's internal data-structures were becoming out of sync whenever an update (e.g. new row addition) to the grid was performed by the server.
For example, the UpdatePanel issues a server request and this server request needs to add a row to the UltraWebGrid. Upon return from the server request, if the newly added row was at the bottom of the grid, its edit cell would be positioned below the borders of the grid. Each subsequent row addition would result in the newly added row's edit cells being positioned lower and lower as if the grid was "bottomless".
I moved my update logic to an out-of-band AJAX call. This requires that, upon return from the call, all grid updates (cell values, row adds, etc) are performed via client JavaScript code. Result: the grid no longer gets out of sync with itself. Furthermore, each server request's payload is lighter -- only the required data is passed back and forth. Lastly, I have full control of when and how a server request is performed. This is important when the input cell has to reflect any newly added rows.