如何删除持久远程填充的 jqgrid 树节点上的闪烁 [英] How to remove flashing on persisting remotely populated jqgrid tree node

问题描述

jqGrid 树节点使用 json 数据从服务器读取.单击节点从服务器读取子节点.如果页面被加载，下面的代码用于恢复打开的树节点.只有单个节点始终在树中打开.控制器将节点 ID 分配给 autoClicked 数组，gridComplete 使用此路径打开节点.这会导致页面加载时网格闪烁，因为多个服务器多次请求构建网格.如何禁用网格闪烁?是否可以防止多个 jqGrid 构建并仅显示找到 jqGrid 树?

回答在 cookie 中发送扩展的 TreeGrid 节点仅适用于完全填充的网格.

var autoClicked=[<%= Model.Path() %>];$(函数(){var grid = $("#tree-grid");grid.jqGrid({网格完成:函数(){设置超时(函数(){var id = autoClicked.shift();var rData = grid.getGridParam('data');变量数据=空；for (var i = 0; i < rData.length; i++) {if (id == rData[i].id) {数据 = rData[i];休息;}}如果(数据 == 空)返回;grid.expandRow(数据);grid.expandNode(数据);}, 0);},url: '<%= ResolveUrl("~/Store/GridData")%>',数据类型:json"，mtype:发布"，高度:自动"，loadui: "禁用",treeGridModel: "邻接",col型号:[{名称:id"，宽度:1，隐藏:真，键:真}，{名称:菜单"，类:手光标"}，{名称:网址"，宽度:1，隐藏:真}],自动宽度:真，树网格:是的，ExpandColumn: "菜单",行数:200，ExpandColClick:真，onSelectRow: 函数 (rowid) {var treedata = grid.jqGrid('getRowData', rowid);window.location = 树数据.url;}});});

控制器:

 公共字符串 Path(){Artomlii 节点 = Artomliik；字符串 res = node.Artomaliik.ToString();而 (!Core.IsNullOrWhiteSpace(node.Treeparent)){//获取父节点node = MyDataContext.ExecQuery<Artomlii>(@"select * from artomlii where treeorder={0}", node.Treeparent).FirstOrDefault();如果(节点==空)休息;res = node.Artomaliik.ToString() + "," + res;}返回资源；}

解决方案

在你的地方，我会用另一种方式解决问题.

我会在 postData 中向服务器发送一个附加参数，其中包含应该展开的节点列表.

如果服务器会将所有请求的节点放在响应中.扩展"隐藏列的值可以直接在服务器响应中设置为 true，也可以在 beforeProcessing 回调中的客户端设置为 true，就像我在 你引用的答案.

您将获得与您需要的结果完全相同的结果.由于消除了不必要的往返，网格的填充将更快.由于使用了 gridview: true 这是当前 jqGrid 实现中 Tree Grids 的默认设置，因此树形网格中的所有行都将一次"填充，因此闪烁将被移除.p>

jqGrid tree nodes are read from server using json data. Click in node reads child nodes from server. Code below is used to restore opened tree node if page is loaded. Only single node is opened always in tree. Controller assings node ids to autoClicked array and gridComplete opens nodes using this path. This causes grid flasinging on page load since multiple server requests buid grid multiple times. How to disable grid flashing ? Is it possible to prevent multiple jqGrid building and show only find jqGrid tree ?

Answer in Send expanded TreeGrid Nodes in cookie works for fully populated grid only.

var autoClicked=[<%= Model.Path() %>];
$(function () {
    var grid = $("#tree-grid");
    grid.jqGrid({
        gridComplete: function () {
            setTimeout(function () {
                var id = autoClicked.shift();
                var rData = grid.getGridParam('data');
                var data = null;
                for (var i = 0; i < rData.length; i++) {
                    if (id == rData[i].id) {
                        data = rData[i];
                        break;
                    }
                }

                if (data == null)
                    return;
                grid.expandRow(data);
                grid.expandNode(data);
            }, 0);

        },
        url: '<%= ResolveUrl("~/Store/GridData")%>',
        datatype: "json",
        mtype: "POST",
        height: "auto",
        loadui: "disable",
        treeGridModel: "adjacency",
        colModel: [
                { name: "id", width: 1, hidden: true, key: true },
                { name: "menu", classes: "handcursor" },
                { name: "url", width: 1, hidden: true }
            ],
        autowidth: true,
        treeGrid: true,
        ExpandColumn: "menu",
        rowNum: 200,
        ExpandColClick: true,
        onSelectRow: function (rowid) {
            var treedata = grid.jqGrid('getRowData', rowid);
            window.location = treedata.url;
        }
    }
            );
});

controller:

    public string Path()
    {
        Artomlii node = Artomliik;
        string res = node.Artomaliik.ToString();
        while (!Core.IsNullOrWhiteSpace(node.Treeparent))
        {
            // retrieve parent node
            node = MyDataContext.ExecQuery<Artomlii>(@"select * from artomlii where treeorder={0}", node.Treeparent).FirstOrDefault();
            if (node == null)
                break;
            res = node.Artomaliik.ToString() + "," + res;
        }
        return res;
    }

解决方案

On your place I would solve the problem in another way.

I would send to the server in postData an additional parameter which contains the list of nodes which should be expanded.

In the case the server will place all requested nodes in the response. The value of "expanded" hidden column can be set to true either directly in the server response or on the client side in the beforeProcessing callback in the way which I described in the answer which you referenced.

In the way you would have exactly the same results which you need. The filling of the grid will be more quickly because of elimination of unneeded round-trips. The flashing will be removed because all the rows in the tree grid will be filled "at once" because of the usage of gridview: true which is default for Tree Grids in the current implementation of jqGrid.

这篇关于如何删除持久远程填充的 jqgrid 树节点上的闪烁的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！