如何集中“加载数据......” jqgrid treegrid中可见屏幕中的消息？

Question

我有一个大约40列的jqGrid treegrid，因此有一个大的水平滚动条（取决于浏览器的大小）。问题是由于宽度太大，当页面加载或我做过滤器等时，你没有看到弹出的“正在加载消息......”。因为它偏离屏幕右侧。

有没有办法让“装载数据......”当前可见屏幕中的消息中心（而不是整个页面？

Answer 1

我发现你的问题很好。同样的问题可能有jqGrid的其他用户。

我个人更喜欢使用loadui: 'block'设置，它在网格加载期间显示整个网格上的叠加层。如果问题不那么重要。

如果您更改loadBeforeSend内的“正在加载...”div的位置，则可以获得更好的结果：

loadBeforeSend: function () {
    var $loadingDiv = $("#load_"+$.jgrid.jqID(this.id)),
        $bdiv = $(this).closest('.ui-jqgrid-bdiv');
    $loadingDiv.show().css({
        top: (Math.min($bdiv.height(), $(window).height()) - $loadingDiv.height())/2 + 'px',
        left: (Math.min($bdiv.width(), $(window).width()) - $loadingDiv.width())/2 + 'px'
    });
}

在我看来，最好修改jqGrid的基本代码（准确地修改beginReq函数的代码）以使上述描述改变“Loading ...”的位置。 div总是。

更新：可能更好地实现更改“正在加载...”div的位置

var gridIdAsSelector = $.jgrid.jqID(this.id),
    $loadingDiv = $("#load_" + gridIdAsSelector),
    $gbox = $("#gbox_" + gridIdAsSelector);
$loadingDiv.show().css({
    top: (Math.min($gbox.height(), $(window).height()) - $loadingDiv.outerHeight())/2 + 'px',
    left: (Math.min($gbox.width(), $(window).width()) - $loadingDiv.outerWidth())/2 + 'px'
});

代码应该像以前一样放在loadBeforeSend中。

更新2 ：The demo展示了这个想法。我在 loadComplate之外添加了代码仅用于演示目的，以展示它是如何工作的。在演示中，“加载”div保持可见，我还显示了使用loadui: 'block'选项时显示的叠加：

Answer 2

将加载消息的容器放在固定位置，顶部和左侧分配大约40％-60％。那会解决它

应该是这样的：

.loading-message-container {
     position : fixed;
     top:50%;
     left: 45%;
}