如果在自由jqgrid中滚动到最右边的位置,如何同步标题和列分隔符行

时间:2015-04-24 20:54:55

标签: jquery css jqgrid free-jqgrid

如果jqgrid滚动到最右边的位置,则列分隔线不在sunc。

要重现,请使jqgrid比浏览器窗口更宽或减小浏览器窗口宽度,以便显示水平滚动条并水平滚动到最右侧位置。 标题和列分隔符垂直线位于不同的位置。

如何解决这个问题?

1 个答案:

答案 0 :(得分:1)

You have long code. It's not the goal of stackoverflow that somebody debug your code. Could you prepare small demo which reproduce the problem?

I debugged the code and could see that the grid have no horizontal bar at the initial loading. Free jqGrid contains detection whether the grid contains horizontal bar after the data are loaded. It sets the padding-right of hbox (the div which is children of hdiv and which have the class ui-jqgrid-hbox) to the width of the scroll bar: bDiv.offsetWidth - bDiv.clientWidth (see the line and this one of code).

If you click on Reload grid button of the grid then the problem with the scroll bar will be fixed. So I suppose that you make some changes on the page after the data are loaded. As the result the grid get horizontal scroll bars. jqGrid don't detect the changes and so the problem exist.

What you can do is to call fixScrollOffsetAndhBoxPadding method manually after you makes the unclear changes on the page which crates horizontal scroll bars. It could be that you just change the width of the grid for example (probably by $grid.jqGrid('setGridWidth', $('#grid1container').width(), false);).

What you can do is just to include the call

$grid[0].fixScrollOffsetAndhBoxPadding();

somewhere after the scrollbar of the grid will be created. The fixScrollOffsetAndhBoxPadding is public and it's the member of DOM of the grid (see the line). The the above code should work.

If I execute the line $("#grid")[0].fixScrollOffsetAndhBoxPadding(); in the console of debugger I see that the problem will be solved.