Dojo 网格刷新和滚动位置答案

【问题标题】：Dojo grid refresh and scroll positionDojo 网格刷新和滚动位置
【发布时间】：2015-08-11 07:52:30
【问题描述】：

我在 Dojo 中有一个 Grid，

var myGrid = new (declare([Grid, DijitRegistry]))({
    store: myStore, // this is a Observable(Memory())
    columns:[
        {field: "field1", label: "A", sortable: false},
        {field: "field2", label: "B", sortable: false},
        {field: "field3", label: "C", sortable: false},
        {field: "field4", label: "D", sortable: false},
        {field: "field5", label: "E", sortable: false}
    ],
    selectionMode: "single",
    cellNavigation: true,
    queryOptions: {
        sort:[{attribute: "field1", descending: true}]
    }
},
    myDomRef
);

有时我需要刷新网格

myGrid.refresh();

此网格右侧有一个滚动条，我想保留滚动条的位置。但是当我刷新时，它会滚动回顶部。

如何保持滚动位置？

【问题讨论】：

标签： javascript dojo dgrid

【解决方案1】：

如上所述，keepScrollPosition 是您使用 OnDemandGrid 时的解决方案。

如果您使用的是dgrid/Grid，则不支持keepScrollPosition。

这就是我解决跳跃滚动条问题的方法（这适用于水平和垂直滚动条）： Grid 有一个方法 getScrollPosition()。通过在refresh() 之前调用此方法，您可以保存两个滚动条的位置，并在刷新完成后跳回它们。代码应如下所示：

var scrollpos = myGrid.getScrollPosition();
myGrid.refresh();
myGrid.scrollTo(scrollpos);

此解决方案的一个限制是旧的 IE 浏览器，存在明显的来回跳转。

【讨论】：

【解决方案2】：

如果您使用OnDemandGrid，它支持keepScrollPosition 属性，您可以在网格实例上定义该属性以影响所有refresh 调用，或者在调用refresh 时专门传递（例如grid.refresh({ keepScrollPosition: true }) )。

【讨论】：

非常感谢，您在哪里找到的？我一直在寻找，找不到类似的东西。
它在github.com/SitePen/dgrid/blob/v0.4.0/doc/components/… 中列出（尽管目前显然不按字母顺序排列）。

【解决方案3】：

尝试抓取包含网格的<div> 对象并获取当前滚动位置：

var elmnt = document.getElementById("myDIV");
var x = elmnt.scrollLeft;
var y = elmnt.scrollTop;

保存位置，然后刷新网格。刷新完成后，恢复滚动位置：

var elmnt = document.getElementById("myDIV");
elmnt.scrollLeft = x;
elmnt.scrollTop = y;

我认为在这种情况下滚动值将位于<div> 对象上。如果没有，请在 Web 浏览器中使用 inspect element，同时将鼠标指针悬停在所需的滚动条上。这应该可以让您找到需要保存和恢复滚动的元素。

如果在 CGI 类型环境中刷新整个页面，您可以将这些值作为 URL 参数传递以完成相同的操作。

【讨论】：