除非将节点分组,否则jqGrid TreeGrid不会排序

时间:2018-08-23 01:03:20

标签: sorting jqgrid treegrid adjacency-list-model

我有一个从服务器加载的jqGrid TreeGrid,排序很好,其中节点包含资产(叶)。一些资产被分组到可扩展这些节点的程序集中。当树第一次加载时,树看起来很完美,并且可以在所有节点上正确排序。所有的叶节点都完全按照其应有的方式排列,并且在单击任何可排序的列标题时,较低层的叶节点也与父节点进行相应的排序。

但是,我也允许用户在不进行分组的情况下以“平面视图”加载树。从已经根据第一列进行排序的服务器再次加载树。平面视图将删除装配体布局,并将所有资产作为叶子返回。该树包含服务器呈现的完美顺序的所有节点。但是在“平面视图”中,树不再通过单击任何可排序的列标题进行排序。因此,我的代码中的某些内容很可能未正确定义。

这是TreeGrid创建代码(使用版本4.5.4):

FragmentA

以及从DB获取资产的服务器端PHP函数:

$('#tree').jqGrid(
{
    datatype: 'local',
    colNames:['Name','ID','Description','Asset Acct','Cost','Cond','Depreciation Acct','Status','','','','','','','','','','','',''],
    colModel:[
                {name:'aname',width:'100',resizable:true,sorttype:'text'},
                {name:'id',width:50,align:'center',resiable:false,sorttype:'int'},
                {name:'adescription',width:'200',resizable:true}, 
                {name:'a_account',width:'100',sorttype:'text'}, 
                {name:'pcost',width:'50',align:'right',formatter:formatPrice,sortable:false}, 
                {name:'pcondition',width:'30',align:'center',formatter:formatCondition,sortable:false}, 
                {name:'d_account',width:'100',sorttype:'text'}, 
                {name:'ssold',width:'30',align:'center',formatter:formatDisposition,sortable:false},
                {name:'pdate',hidden:true},
                {name:'pvendor',hidden:true},
                {name:'sdescription',hidden:true},
                {name:'sdate',hidden:true},
                {name:'sprice',hidden:true},
                {name:'sexpense',hidden:true},
                {name:'alocation',hidden:true},
                {name:'apo',hidden:true},
                {name:'asn',hidden:true},
                {name:'awdate',hidden:true},
                {name:'aid',hidden:true}, 
                {name:'did',hidden:true}
            ],
    gridview: false,
    height: 'auto',
    autowidth: true,
    rowNum: 10000,
    sortname: 'aname',
    treeGrid: true,
    treeGridModel: 'adjacency',
    treedatatype: 'local',
    treeIcons: {plus:'ui-icon-folder-collapsed',minus:'ui-icon-folder-open',leaf:'ui-icon-document'},  
    ExpandColumn: 'aname',
    ExpandColClick: true,
    loadonce:true,
    width: '100%',
    scrollOffset: 0
});

还有使用资产加载树的javascript函数:

// recursive function (when loading assets in group view)
function getAssets($parentid=0, $level=0, $hierarchicalview=1)
{
    $sql = "SELECT a.*, (SELECT COUNT(*) FROM mod_accounting_assets WHERE parentid=a.id) AS childCount FROM mod_accounting_assets a ";
    if($hierarchicalview == 1) { $sql .= "WHERE a.parentid={$parentid} "; } else { $sql .= "WHERE adescription <> 'Asset Grouping'"; }
    $sql .= "ORDER BY LOWER(a.aname)";
    $stmt = AMDB::selectStatement($sql);
    while($data = $stmt->fetch(PDO::FETCH_ASSOC))
    {
        $data['pdate'] = fromMySQLDate($data['pdate']);
        $data['sdate'] = $data['sdate'] != "0000-00-00" ? fromMySQLDate($data['sdate']) : "";
        $data['awdate'] = $data['awdate'] != "0000-00-00" ? fromMySQLDate($data['awdate']) : "";
        $data['a_account'] = am_getCOAName($data['aid'], 1, 1);
        $data['d_account'] = am_getCOAName($data['did'], 1, 1);

        $data['loaded'] = true;
        $data['parent'] = $data['parentid'] == 0 ? "null" : $data['parentid'];

        // showing in grouped format
        if($hierarchicalview == 1)
        {
            $data['level'] = $level;
            $data['isLeaf'] = $data['childCount'] == 0 ? true : false;

            // have children, sum them, and recurse deeper
            if($data['childCount'])
            {
                $sql = "SELECT SUM(pcost) FROM mod_accounting_assets WHERE parentid={$data['id']}";
                $data['expanded'] = false;
                $data['pcost'] = AMDB::selectColumn($sql);
                $assets[] = $data;
                $assets = array_merge($assets, getAssets($data['id'], $level+1, $hierarchicalview));
            }

            // no children
            else
            {
                $data['level'] = $level;
                $data['isLeaf'] = $data['aname'] != "Asset Grouping";
                $assets[] = $data;
            }
        }

        // showing flat view
        else
        {
            $data['level'] = 0;
            $data['isLeaf'] = $data['aname'] != "Asset Grouping";  
            $assets[] = $data;
        }
    }
    return $assets;
}

要首先在页面加载时加载树,我们使用php将资源以分组模式放入数组中,使用php json_encode()将其编码为JSON,然后在文件中嵌入对loadTree($ assets)的调用.ready()事件如下:

// load the tree from json encoded array
function loadTree(data)
{
    $('#tree')[0].addJSONData({
        total: 1,
        page: 1,
        records: data.length,
        rows: data
    });
    $('#tree').trigger('reloadGrid');
}

当用户希望从组视图更改为平面视图时,Ajax请求将发送到服务器,然后将以JSON编码的字符串返回的结果资产传递到相同的loadTree(assets)javascript函数。这里没有AJAX调用,只有处理成功的AJAX返回的函数:

echo("\n
$(document).on('ready', function()\n
{\n
    // load the tree\n
    loadTree({$assets});\n
});\n
";

谁能告诉我为什么这棵树在初始加载时可以完美地排序,但是当以平面视图加载时,树本身按名称可以完美地排序,但是单击列标题并没有明显的变化吗?

以下是在平面视图中加载资产时AJAX提交返回的完整JSON:

// ajax successful return function 
// this function is our success function passed to our jquery AJAX call
// data is the assets array encoded in JSON string
function(result,message,data)
{
    loadTree(data); 
});

1 个答案:

答案 0 :(得分:0)

检查返回的AJAX数据后,我实际上找到了自己的答案。

以分组方式加载时,服务器将返回包含名为“ parent”的字段的节点,该字段包含父节点的ID。 treegrid使用此字段来了解如何将节点正确地分组。

在“平面视图”模式下加载时,服务器端代码包括将此相同的“父”字段设置为正确的父节点,但是服务器在返回中不包括实际的父节点。因为某些节点指向不存在的父节点,所以Treegrid无法应用排序。

但是现在,“父级”字段以“平面视图”结果返回为null,因此treegrid应该在所有列上正确排序,因为它看起来没有对父级进行排序。