slickgrid resize causes scrollbar problem near bottom

[Schobenhauer]

trafficstars

I have the following problem: I use Slickgrid in combination with jquery layout. Panes can be resized with this plugin. When I resize the Slickgrid pane, so that a horizontal scrollbar appears, which wasn't there at first, I am unable to scroll all the way to the bottom.

I have created a jsfiddle to demonstrate: http://jsfiddle.net/uNMRT/2/

Steps to reproduce:

1. make sure the slickgrid pane doesn't have a horizontal scrollbar.
2. scroll all the way doen. (works nicely, you can view record 119, the last one)
3. resize the slickgrid pane using the vertical splitter. Make sure to make the slickgrid area smaller to have a horizontal scrollbar appear.
4. scroll all the way down again. Notice that you are unable to scroll completely down. Record 119 can't be seen now.

I already do a resizeCanvas upon resize. That's not enough obviously. Any ideas?

[jamoville]

I am having this same problem. This doesn't appear to be a problem with 2.0 just 2.1

[jamoville]

So the issue here appears to be in slick.grid.js line 399 viewportHasHScroll = (canvasWidth > viewportW - scrollbarDimensions.width);

This is called once when there is no horizontal scroll bar. After the resize in the example happens and causes the scrollbar to appear this viewportHasHScroll is still false so in the scrollTo function the Math.min calculation that uses this value doesn't take into account there is now a scrollbar.

[eyalmaaravi]

I've been having this problem too.

It appears that this issue can be fixed with the following change in slick.grid.js, line 1625, in function updateRowCount:

else { // scroll to bottom scrollTo(th - (viewportH - (viewportHasHScroll ? scrollbarDimensions.height : 0))); }

I'd appreciate If someone can review this fix and give their feedback.

[codedhead]

As jamoville suggested, I move that line out of the if block, so it get called every time when updateCanvasWidth is called

if (canvasWidth != oldCanvasWidth) { $canvas.width(canvasWidth); $headerRow.width(canvasWidth); $headers.width(getHeadersWidth()); //viewportHasHScroll = (canvasWidth > viewportW - scrollbarDimensions.width); } viewportHasHScroll = (canvasWidth > viewportW - scrollbarDimensions.width);

This seems to solve the problem. Does that make sense? Hope this issue would get fixed in next update.

[mleibman]

I am unable to reproduce this problem.

[codedhead]

I also use slickgrid with jquery layout. I can reproduce the problem as follows:

1. First of all, I maximize my window.
2. Then I load the grid with, say, 20 rows, no vertical and horizontal scrollbar are shown.
3. I resize the window until vertical and horizontal scrollbar appear, then comes the problem : I can not scroll down to the bottom, the horizontal bar is covering the last row.

[mleibman]

Still no luck reproducing this. Any particular browser?

[eyalmaaravi]

It happened in Chrome for me. It happened in the same scenario as jun described - start with a grid with no horizontal scrolling, so that the columns take up exactly 100% of the horizontal space. Then resize a column to a bigger size, so that the horizontal scrollbar appears. Then scroll to the bottom. You'll notice that it doesn't scroll all the way down.

[eyalmaaravi]

Hey Michael,

Any luck reproducing this issue?

[eyalmaaravi]

Hi Michael,

This bug no longer reproduces after updating from V2.1 to V2.2, so I think this issue can be closed. Thanks!

[szintak]

Hi all,

I know its been awhile since there was activity but I'm starting to experience this behavior using V2.2 and was wondering if anyone else was as well. I'm still going through all the rendering code to figure out why but I believe it's somehow tied to my use of frozen columns.

Any information or suggestions are greatly appreciated.

Thanks!

[6pac]

Have you tried the 'alternative master' repo ? There are a number of fixes to do with changes to jQuery around v8. The master of the MLeibman branch is still using an old version of jQuery, and when an updated jQuery version is used some bugs manifest. I've copied the alternate master repo to a GitHub Pages location, so you can use the files in a fiddle in the same way you can for the main branch.

[jasonfulps]

Thanks jamoville, you pointed to the exact problem. In v2.2 viewportHasHScroll is only ever being set once upon initialization. Because of this, the problem does not appear if and when the H scrollbar was initially visible which could be the cause of why some did and others did not experience this.

The solution is to simply add the following line in the updateRowCount() function so its updated on resize events:

  viewportHasHScroll = (canvasWidth > viewportW - scrollbarDimensions.width);

[6pac]

jasonfulps patch applied to 'alternative master' repo