向ui-grid添加滚动条会覆盖底行

时间:2017-07-14 16:39:09

标签: ui-grid

我正在处理的应用在页面上有一个ui-grid。最近,我们在网格中添加了一个水平滚动条,并启用了#34;固定"这样当网格水平滚动时,某些列可能会被冻结。

我注意到的一个奇怪的行为是新添加的滚动条覆盖了表格中的最后一行。有没有其他人经历过这个,如果有的话,想出如何阻止它发生?我已经尝试了我能想到的一切(即改变行高,网格的动态大小等),但没有任何工作。我希望其他人克服这个问题,并告诉我他们是如何做到的。

enter image description here

1 个答案:

答案 0 :(得分:0)

嗯,我找到了解决这个问题的方法,但我们的网格是如何创建的。

我们所有具有水平滚动功能的网格都有前三列固定。我使用下面的代码来查看相关网格是否具有用于固定的网格选项。如果网格为scrollable,我只需将15添加到网格的高度。这使得网格更大,以便滚动条有足够的空间而不会覆盖底行。

var scrollbarOffset = 15;
var buffer = 5;
var gridHeight = ((rowCount > 0 ? rowCount : 1) * rowHeight) + footer + header + filter + buffer;
var scrollable= $.grep(element[0].attributes,
function (rn) {
                return rn.nodeName === "ui-grid-pinning";
              }).length > 0;

if (scrollable) {
    gridHeight = gridHeight + scrollbarOffset;
}   
相关问题