Dojox Datagrid 包含数据，但显示为空答案

【问题标题】：Dojox Datagrid contains data, but shows up as emptyDojox Datagrid 包含数据，但显示为空
【发布时间】：2011-01-21 12:11:02
【问题描述】：

非常感谢您对此提供的任何帮助。我正在以编程方式创建这个 Dojox Datagrid 并提供 JSON 数据。到目前为止，我正在 JavaScript 本身中创建这些数据。请参考以下代码示例。

var upgradeStageStructure =[{
    cells:[
      {
        field: "stage",
        name: "Stage",
        width: "50%",
        styles: 'text-align: left;'
      },
      {
        field:"status",
        name: "Status",
        width: "50%",
        styles: 'text-align: left;'
      }
    ]
    }];

    var upgradeStageData =
      [
        {id:1, stage: "Preparation", status: "Complete"},
        {id:2, stage: "Formatting", status: "Complete"},
        {id:3, stage: "OS Installation", status: "Complete"},
        {id:4, stage: "OS Post-Installation", status: "In Progress"},
        {id:5, stage: "Application Installation", status: "Not Started"},
        {id:6, stage: "Application Post-Installation", status: "Not Started"}
      ];
    var stagestore = new dojo.data.ItemFileReadStore({data:{identifier:"id", items: upgradeStageData}});
var upgradeStatusGrid = new dojox.grid.DataGrid({
        autoHeight: true,
        style: "width:400px;padding:0em;margin:0em;",
        store: stagestore,
        clientSort: false,
        rowSelector: '20px',
        structure: upgradeStageStructure,
        columnReordering: false,
        selectable: false,
        singleClickEdit: false,
        selectionMode: 'none',
        loadingMessage: 'Loading Upgrade Stages',
        noDataMessage:'There is no data',
        errorMessage: 'Failed to load Upgrade Status'
    });

    dojo.byId('progressIndicator').innerHTML='';
    dojo.byId('progressIndicator').appendChild(upgradeStatusGrid.domNode);
    upgradeStatusGrid.startup();

问题是我在显示时在网格中看不到任何东西（没有标题，没有数据）。但我确定网格中的数据确实存在并且网格已正确初始化，因为我调用了alert (grid.domNode.innerHTML);。生成的 HTML 确实显示了一个包含标题行和上述数据的表格。

This link 包含一个图像，它说明了我在显示页面时看到的内容。（无法发布图片，因为我的帐户是这里的新帐户）

您可能会注意到，我创建的 6 条数据有 6 行，但网格一团糟。如果您认为自己知道可能出了什么问题，请帮忙。

提前致谢，万岁

【问题讨论】：

你能用这个做一个演示吗？ jsfiddle.net
埃里克，我会这样做的。但是你能检查一下我在下面发布的更新吗？谢谢。

标签： datagrid dialog dojo

【解决方案1】：

首先要做的是使用类似 Firebug，http://getfirebug.com/，检查 DOM 以查看您的数据网格是否被插入到 DOM 中（但不可见）。寻找“dojoxGrid”类的东西如果你看到了，你看到任何与之相关的样式吗？如果可能是您的高度设置为 0，或者它的样式被设置为隐藏，或者...

当我没有将网格的高度设置为固定像素数时，我遇到了您所描述的问题。因此，一旦我的网格如下所示，一切正常：

(In my HTML Markup:)
<div id="kgbHolder"></div>

(In my JavaScript:)
var kgbStore = new dojox.data.QueryReadStore({ url: "kgbService.php?kgbID=" + id });
var kgbGrid = new dojox.grid.DataGrid({
            store: kgbStore,
            noDataMessage: 'No kreits associated with selected query.',
            selectionMode: 'single',
            height: "400px",
            clientSort: true,
            structure: kgbGridLayout
        });
var kgbHolder = dojo.byId('kgbHolder'); 
kgbHolder.appendChild(kgbGrid.domNode);
kgbGrid.startup();
dijit.byId('kgbDialog').show();

注意：我在使用样式键设置高度（与宽度）时遇到问题。试试看只有高度：“someNumpx”。

【讨论】：

【解决方案2】：

我终于可以解决这个问题了！在我的 HTML 文件中，我有以下标记：

<center>
 <div id="gridArea">
   <div dojoType="dojox.data.DataGrid" dojoAttachPoint="myGrid"></div>
 </div> 
</center>

问题出在<center> 标签上。删除它会导致网格正确显示数据。这很奇怪，如果有人能解释为什么会发生这种情况，我将不胜感激。

【讨论】：