free-jqGrid 4.15.6 ExpandNode 产生运行时错误

free-jqGrid 4.15.6 ExpandNode producing runtime error

我最近从原来的 Tony Tomov 的 jqGrid v4.5.4 升级到 Oleg 的免费 jqGrid 4.15.6。

当使用 4.5.4 时,下面的代码运行完美,但在 4.15.6 中,它不是。 运行 时间错误是由对位于 forceNodeOpen() 函数中的 expandNode 和 expandRow 的两次调用产生的。给出的错误:

TypeError: rc1 未定义

forceNodeOpen()函数用于强制当前treegrid节点的所有祖先节点展开显示。很像 table 的内容...如果我们加载初始主题节点,我们希望扩展整个主题层次结构:

// force a node (if expandable) to stay expanded
function forceNodeOpen(rowid)
{
    var record = $("#tree").jqGrid('getRowData', rowid);
    var div = $('tr#'+rowid).find('div.ui-icon.treeclick');
    div.removeClass('ui-icon-triangle-1-e tree-plus').addClass('ui-icon-triangle-1-s tree-minus');
    **$('#tree').jqGrid('expandNode', record);**    
    **$('#tree').jqGrid('expandRow', record);**

    // get all ancestoral parents and expand them
    // *NOTE*: the getAncestorNodes function of grid was not usable for 
    //         some reason as the same code below just would not work 
    //         with the return array from getAncestorNodes
    var parent = $("#tree").jqGrid('getNodeParent', record);
    while(parent)
    {
        forceNodeOpen(parent['id']);
        parent = $("#tree").jqGrid('getNodeParent', parent);
    }
}

// using topic url, get the tree row id
function getTopicID(topic)
{
    var nodes = $('#tree').jqGrid('getRowData');
    var rowid = 1;
    $.each(nodes, function(e,i)
    {
        var url = $(this).attr('url');
        if(url == topic)
        {
            rowid = $(this).attr('id');
            return false;
        }
    });

    return rowid;
}

// post request to help server via ajax
function loadTopic(topic)
{
    // no need to load again
    if(loadedtopic == topic) { return false; }

    // select the topic node
    var rowid = getTopicID(topic);
    loading = true;
    $('#tree').jqGrid('setSelection', rowid);
    forceNodeOpen(rowid);
    loading = false;

    // wipe content
    $('h1#help_content_topic span:first').html('Loading...');
    $('div#help_content').html('');

    // block UI for ajax posting
    blockInterface();

    // request help content
    $.ajax(
    {
        type: 'POST', 
        url: '/index.php',
        data: { 'isajax': 1, 'topic': topic },
        success: function(data)
        { 
            $.unblockUI();
            $('h1#help_content_topic span:first').html(data['topic']);
            $('div#help_content').html(data['content']);
            return false;
        }
    });

    // save current topic to prevent loading same topic again
    loadedtopic = topic;
}

// table of contents
$('#tree').jqGrid({
    url: "topics.php",
    datatype: "xml",
    autowidth: true,
    caption: "Help Topics",
    colNames: ["id","","url"],
    colModel: [
        {name: "id",width:1,hidden:true, key:true},
        {name: "topic", width:150, resizable: false, sortable:false},
        {name: "url",width:1,hidden:true}
    ],
    ExpandColClick: true,
    ExpandColumn: 'topic',
    gridview: false,
    height: 'auto',
    hidegrid: false,
    pager: false,
    rowNum: 200,
    treeGrid: true,
    treeIcons: {leaf:'ui-icon-document-b'},

    // auto-select topic node
    gridComplete: function()
    {
        // save current topic to prevent loading same topic again
        loadedtopic = '<? echo($topic) ?>';
        var rowid = getTopicID('<? echo($topic) ?>');
        $('#tree').jqGrid('setSelection', rowid);
        forceNodeOpen(rowid);
        $.unblockUI();
    },

    // clear initial loading
    loadComplete: function()
    {
        loading = false;
    },

    onSelectRow: function(rowid)
    {
        // ignore initial page loads
        if(loading) { return false; }

        // load the selected topic
        var topic = $("#tree").jqGrid('getCell',rowid,'url');
        loadTopic(topic);
    }
});

forceNodeOpen(rowid) 是从 loadTopic() 函数调用的,该函数在树状网格的 onSelectRow() 事件中调用。

不确定 4.5.4 做了什么允许此代码工作,但 4.15.6 发现它是一个错误。 4.15 中的违规行。6.src.js:

expandNode: function (rc) { 
...
if (p.treedatatype !== "local" && !base.isNodeLoaded.call($($t), p.data[p._index[id]]) && !$t.grid.hDiv.loading) {
// set the value which will be used during processing of the server response
// in readInput
p.treeANode = rc1.rowIndex;
p.datatype = p.treedatatype;
...});

我只包含了上述核心函数中的几行。抛出错误的是 p.treeANode = rc1.rowIndex。

我必须缺少一些东西但不知道是什么。希望有人能告诉我该怎么做。如果我在 forceNodeOpen() 函数中标出两个 expandNode 和 expandRow treegrid 函数调用,系统不会出错并加载所需的主题。但是层级没有按要求展开。


开始编辑 1


returns主题节点的服务器端代码:

echo("<?xml version='1.0' encoding='UTF-8'?>\n");

require('db.php');

echo("<rows>\n");
echo("<page>1</page>\n");
echo("<total>1</total>\n");
echo("<records>1</records>\n");

$sql = "SELECT node.id, node.parentid, node.topic, node.url, node.lft, node.rgt, (COUNT(node.parentid) - 1) AS depth 
            FROM helptopics AS node, helptopics AS parent 
                WHERE node.lft BETWEEN parent.lft AND parent.rgt
                    GROUP BY node.url ORDER BY node.lft";
$stmt = AMDB::selectStatement($sql);
while($data = $stmt->fetch(PDO::FETCH_ASSOC))
{
    $id = $data['id'];
    $pid = $data['parentid'];
    $topic = $data['topic'];
    $url = $data['url'];
    $lft = $data['lft'];
    $rgt = $data['rgt'];
    $leaf = $rgt - $lft == 1 ? 'true' : 'false';
    $exp = 'false';
    $dep = $data['depth'];

    echo("<row><cell>{$id}</cell><cell>{$topic}</cell><cell>{$url}</cell><cell>{$dep}</cell><cell>{$lft}</cell><cell>{$rgt}</cell><cell>{$leaf}</cell><cell>{$exp}</cell></row>\n");
}

echo("</rows>\n");
exit();

结束编辑 1


我看到你用

var record = $("#tree").jqGrid('getRowData', rowid);

获取TreeGrid的节点数据。这不好,但它在旧的 jqGrid 中工作,因为它保存了内部 jqGrid 数据两次:一次作为本地数据,一次在网格的隐藏单元格中。

你应该使用 getLocalRow 而不是 getRowData:

var record = $("#tree").jqGrid('getLocalRow', rowid);

该代码适用于旧版 jqGrid 和免费版 jqGrid。此外,即使在 jqGrid 4.5.4 中,getLocalRow 始终比 getRowData 具有更好的性能。