page scroll up and down when double click to edit

[mtParticipant]

I need your help in jqxTreeGrid (jQWidgets v3.6.0). I am facing a problem while editing in IE10 (working fine in chrome). when I expanded rows in jqxTreeGrid till scroll bar appears than whenever double click to edit something or select a row page scroll up and down automatically. Not able edit row. Its works fine when there is no scroll in window. This problem was not in jqwidgets-version 3.4.0.

[ivailoParticipant]

Hi mt,

The latest version is 3.8.2. Please try to update.

Best Regards,
Ivailo Ivanov

jQWidgets Team
http://www.jqwidgets.com

[mtParticipant]

I have already tried with latest version but problem still persists.

[ivailoParticipant]

Hi mt,

Please send jsFiddle/jsEditor link with your code for better vizualization of the problem.

Best Regards,
Ivailo Ivanov

jQWidgets Team
http://www.jqwidgets.com

[SiddharthParticipant]

Hi All,

We are facing the same issue with TreeGrids, DataTables and Grids in our projects as well but with IE11. I will try to create a fiddle to be more specific and clear. But the gist of it is, whenever the tree grid or table or grid is not fully visible and I end editing of a cell the browser window scrolls to make the entire grid or table visible. After this if there is no scrolling anymore till I don’t manually scroll to make the control partially visible.

Will update with a fiddle soon.

Thanks & Regards,
SiD

[SiddharthParticipant]

Hi,
I am able to recreate the issue in one of the API examples itself, the one about endcelledit event of treegrids, please find the fiddle link below:
https://jsfiddle.net/jqwidgets/nCx5c/

To recreate, edit cells to generate logs below till there is a scroll bar in the results view, scroll to the bottom of the result and click on a non-editable cell you can see a distinct wobbling on IE11 and on editing a cell & clicking anywhere the result section scrolls to the top. How can I prevent this scrolling. Checked in other browsers with the following outcome:

1. Firefox 40.0.3 no issue but scrolling was happening with ver 35.0
2. Chrome 45+ issue is there scrolling to top as well but no wobbling.

Thanks & Regards,
Siddharth Seth

[Peter StoevKeymaster]

Hi Siddharth Seth,

Web Browser’s focus work in that way – scroll to the Focused element. You cannot prevent this.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[SiddharthParticipant]

Hi All,

Greetings!
So, This is what we ended up doing to get around all the scrolling:
1. Add a handler to the treegrid for focusin and focus event and call preventDefault().
2. Make the editable column’s columntype as template and implement cellsrenderer, creategrideditor, initgrideditor and geteditorvalue for the column.
3. In the creategrideditor attach an event handler to the underlying dom element’s focusin and focus events and again here call preventDefault() on the event object.

This seems to prevent all the scrolling when you tab across a row of editable cells. To demonstrate I modified the above fiddle to the below:
https://jsfiddle.net/nCx5c/101/

In this fiddle if you click around to get log and scrollbars then scroll down to make the grid partially visible. Then tab back and forth between the cells of the first two columns there is no automatic scrolling, but if you tab between the cells of the third and fourth column there is going to be scrolling to make the entire grid visible.

Hope this helps, I arrived at this through studying various resources on the web.

Also, couple of days ago I noticed that with jqxGrid the scrolling issue does not happen if we use the multiplecellsadvanced selection mode, which is not available for other widgets I think.

Thanks & Regards,
Siddharth Seth

[Author]

Posts