要求
- 带有 Pagiantion 的表(每次 WS 调用获取 30 行)
- 行扩展器 - 获取子集合
- 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}
不知道为什么?