ag-Grid javaScript,TypeError:rowData未定义

时间:2017-03-02 18:19:06

标签: ag-grid

ag-Grid,遵循official demo的javascript但使用类似现实世界的API而不是硬编码数据。注意:没有jQuery,只需使用原始的纯XMLHttpRequest()来获取ajax。

  • F12验证的API以与demo相同的结构返回数据,内部有 children 节点,并且handleOptions.rowData与返回的数据一起分配。
  • 尝试将rowData内的gripOptions实例化为 rowData: [],得到了同样的错误 要么 rowData: {},得到了ReferenceError:未定义rowData。

HTML:

<script src="/scripts/agGrid/ag-grid.js"></script>
<script src="/scripts/agGrid/myAG.js"></script>
<br />JavaScript ag-Grid
<div id="myGrid" style="height: 200px;" class="ag-fresh"></div>

myAG.js:

var httpApi = new XMLHttpRequest();
var columnDefs = [
    { headerName: "Client Name", field: "ClientName", unSortIcon: true, cellRenderer: "group" },
    { headerName: "Division", field: "Division" },
    { headerName: "Others", field: "Others" }
];
var gridOptions = {
    columnDefs: columnDefs,
    getNodeChildDetails: getNodeChildDetails
};

function getNodeChildDetails(rowItem) {
    if (rowItem.ClientName) {
        return {
            group: true,

        // provide ag-Grid with the children of this group
            children: rowItem.children,

            // the key is used by the default group cellRenderer
            key: rowItem.ClientName
        };
    } else {
        return null;
    }
}

// wait for the document to be loaded, otherwise
// ag-Grid will not find the div in the document.
document.addEventListener("DOMContentLoaded", function () {
    $.ajax({
        type: "GET",
        url: "/api/myAG/Tree",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            gridOptions.rowData = data;
            var eGridDiv = document.querySelector('#myGrid');
            new agGrid.Grid(eGridDiv, gridOptions);
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert(errorThrown);
        }
    })

});

版本: ag-grid = v8.1.0 FireFox = 50.1.0

错误讯息: Error msg

F12确认数据存在并分配:

F12 confirmed data exists and assigned

在ag-grid.js里面,它抱怨的行但rowData有数据: rowData has data inside of ag-grid.js where the error complains about

1 个答案:

答案 0 :(得分:0)

请参阅此回答帖子,基本上需要对树进行额外检查。

ag-Grid, try to make Tree Demo work using own data