2

要求

  1. 带有 Pagiantion 的表(每次 WS 调用获取 30 行)
  2. 行扩展器 - 获取子集合
  3. Child - 无限滚动的表格

我计划使用,ojTable,oj.Collection,oj.Model oj.PagingTableDataSource <- oj.FlattenedTreeTableDataSource <- oj.FlattenedTreeDataSource <- oj。CollectionTreeDataSource <- oj.Collection 层次结构

代码

模型

define([
    "Model"
], function(Model) {
    "use strict";
    var Code = Model.extend({
        "urlRoot": "code",
        "idAttribute": "rowNum",
        "defaults": {
            "rowNum": null,
            "code": null
        }
    });
    return Code;
});

收藏

define([
    "Collection"
    "../models/Code"
    ], function(Collection, Code){
        "use strict";
        var Codes = Collection.extend({
            url: "code",
            model: Code
        });
        return Codes;
});

虚拟机代码

self.codes = new Codes(null, collectionOptions);
self.treeDataSource = new oj.CollectionTreeDataSource(
        {
            root:self.codes,
            parseMetadata:function(model){
                var retObj = {};
                retObj['key'] = model.id;
                return retObj;
            },
            childCollectionCallback:function(col , model){
            ...
            }
        });

self.treeTableDataSource = new oj.FlattenedTreeTableDataSource(new oj.FlattenedTreeDataSource(self.treeDataSource));
self.dataSource = new oj.PagingTableDataSource ( self.treeTableDataSource );

html

<table id="table" 
    data-bind="ojComponent: 
    {
        component: 'ojTable', 
        data: dataSource, 
        rowTemplate: 'row_temp', 
        columns:$component.columns
    }">
</table>
<div id="paging" data-bind="ojComponent: {component: 'ojPagingControl', data: $component.dataSource, pageSize: 10}">
</div>
<script type="text/html" id="row_temp">
    <tr>
      <td>
        <div data-bind="ojComponent: {
            component: 'ojRowExpander', 
            context: $rowContext}"></div>
      </td>
    </tr>
</script>

问题:

1) ojtable 中的数据也是“未定义”的,尽管数组大小是正确的。已经用普通的 TableDataSource 测试了相同的集合并且工作正常。

ojtable.js:8265 Uncaught (in promise) TypeError: Cannot read property 'toString' of undefined
    at oj.TableDomUtils.hashCode (http://127.0.0.1:8080/js/libs/ojet/oj/v2.0.2/debug/ojtable.js:8265:14)
    at _refreshTableBodyRow (http://127.0.0.1:8080/js/libs/ojet/oj/v2.0.2/debug/ojtable.js:5296:52)
    at ._refreshTableBodyRow (http://127.0.0.1:8080/js/libs/jquery/jqueryui-amd-1.11.4.min/widget.js:4:1032)
    at _refreshTableBody (http://127.0.0.1:8080/js/libs/ojet/oj/v2.0.2/debug/ojtable.js:5256:20)
    at ._refreshTableBody (http://127.0.0.1:8080/js/libs/jquery/jqueryui-amd-1.11.4.min/widget.js:4:1032)
    at _refreshAll (http://127.0.0.1:8080/js/libs/ojet/oj/v2.0.2/debug/ojtable.js:5155:14)
    at ._refreshAll (http://127.0.0.1:8080/js/libs/jquery/jqueryui-amd-1.11.4.min/widget.js:4:1032)
    at .<anonymous> (http://127.0.0.1:8080/js/libs/ojet/oj/v2.0.2/debug/ojtable.js:3826:18)
    at http://127.0.0.1:8080/js/libs/ojet/oj/v2.0.2/debug/ojtable.js:6681:39

2)在这种情况下,我看到分页没有设置偏移量,但在普通表中按预期工作。

3) 我看到 WS 调用在初始加载时执行了多次(尽管获取大小为 30,但获取所有记录),因为它应该只获取前 30 条记录。

4) oj.CollectionTreeDataSource 使用的选项文字及其所有 root/parseMetadata/childCollectionCallback 未记录

伙计们,请在这里帮忙。为什么数据未定义并且在加载而不是分页时有多个调用

欧杰 v2.0.2

我只是碰巧调试并发现

ojcollectiontreedatasource.js

oj.CollectionNodeSet.prototype.getData = function(index)
{
    this._checkRange(index);
    return this.collection.at(index).attributes;
};

返回

Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: undefined}

不知道为什么?

4

1 回答 1

2

我遇到过同样的问题。在调试(很多)之后,结果发现oj.ModelsidAttribute指向一个不存在的字段。

例如:

var CustCollection = new oj.Collection.extend({
    url : 'https://dev.example.com/app/rest/categories',
    model : new oj.Model.extend({
        parse : function __parseSearch(response) {
            console.log(response); // <-- CHECK HERE
            return response;
        },
        idAttribute : 'categoryId' // <-- FIX HERE
    }),
    comparator : 'categoryId' // <-- FIX HERE
});

self.CustColl(new CustCollection());
self.searchDatasource(new oj.CollectionTableDataSource(self.CustColl()));

在这里我遇到了复制粘贴错误,我也忘记更改idAttribute了。

因此,请检查您的数据源的响应并相应地进行修复。

问题是ojTable在当前行上没有找到键(==idAttribute)列的值,并且没有在那里发脾气,它默默地继续前进,并且由于缺少空检查,我们被通知了一个完全不相关的问题.

于 2017-08-03T14:10:32.510 回答