我有几个DGrid OnDemandGrids,它们是在一系列标签中创建的,每个标签都包含一个带网格的内容窗格。网格以Rest服务为目标,提供范围标题,id属性等。首先/选择/可见的选项卡完全填充了对Rest服务的多次调用。其他一些选项卡填写正常,但它们是稀疏填充的,因此只需要一次调用该服务。有问题的选项卡仅显示前25个选项卡,因为它只查询服务一次(数据存储区中有超过一千条记录)。
因此,如果在创建网格之前问题选项卡是选定的选项卡,则相关选项卡会调用其余服务两次以填充网格的可见部分。如果在选择之前创建选项卡和网格,则仅发生第一个查询(在打开选项卡之前)并且在网格中,并且从不查询其余查询。我只能猜测未选择/显示选项卡,网格可能不知道要查询多少以填充与选项卡匹配的网格大小。
测试代码包含在下面,但使用内部休息服务。我在网格中混合了DijitRegistry。如果我遇到问题并单击其中一列以在问题网格中排序,则所有内容都会正确填充。尝试grid.resize并将网格直接放在tabcontainer上没有任何影响。
简单的OnDemandGrid,目标是一个Rest服务,它绑定到添加到tabcontainer的contentpane的href中的DOM id,但是会导致很多问题......
建议?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test dGrid</title>
<link rel="stylesheet" href="dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="dojo/dgrid/css/dgrid.css">
<link rel="stylesheet" href="dojo/dgrid/css/skins/claro.css">
<style>
.claro {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: .75em;
color: #000;
}
body, html {
width:100%;
height:100%;
margin:0;
padding:0;
overflow:hidden;
}
#Grid1 {
width: 100%;
height: 100%;
}
</style>
<script src="dojo/dojo/dojo.js" data-dojo-config="async:true, parseOnLoad:true, locale:'en'"></script>
<script>
require([
"dojo/ready",
"dijit/registry",
"dojo/_base/declare",
"dgrid/OnDemandGrid",
"dgrid/extensions/DijitRegistry",
"dstore/Memory",
"dstore/Rest",
"dijit/layout/TabContainer",
"dijit/layout/ContentPane"
],
function (ready, registry, declare, Grid, DijitRegistry, Memory,Rest) {
ready(function () {
var mystore = new (declare([Rest]))({
target : "Rest/HR/Employees",
idProperty: "employeeID",
});
var datacolumns = {
employeeID : 'ID',
fname: "First Name",
lname: "Last Name",
username : 'User Name',
employeeNbr: "Employee Number",
unitName: "Unit Name",
inserted: "Inserted",
updated: "Updated",
updatedBy: "Updated By",
counter : 'count'
};
var CustomGrid = declare([Grid, DijitRegistry]);
this.Grid1 = new CustomGrid({
collection: mystore,
columns: datacolumns,
idProperty: "id"
}, "Grid1");
this.Grid1.startup();
});
});
</script>
</head>
<body class="claro">
<div id="TabContainer" data-dojo-type="dijit/layout/TabContainer" style="width:100%; height:100%" data-dojo-props="tabStrip:true">
<div id="Tab1" data-dojo-type="dijit/layout/ContentPane" title="Emtpy" data-dojo-props="selected:true">
Nothing here, just to keep tab 2 hidden until clicked on
</div>
<div id="Tab2" data-dojo-type="dijit/layout/ContentPane" title="Grid">
<div id="Grid1"></div>
</div>
<div id="Tab3" data-dojo-type="dijit/layout/ContentPane" title="Empty">
Nothing
</div>
</div>
</body>
</html>
答案 0 :(得分:0)
看起来罪魁祸首是grid.startup()
。注意到另一个有类似问题的问题提到了启动调用的时间。移动启动调用,直到显示选项卡(onShow
的{{1}}事件)之后,它整理了网格图并查询了Rest服务。