如果不是正文的直接子节点,则Dojo(1.9.1)数据网格不会呈现

时间:2013-08-26 06:06:33

标签: dojo dojox.grid

我在自定义窗口小部件中渲染数据网格时遇到问题。

我能够找到问题所在:不是身体的直接子项的数据网格无法正确呈现。

展示:

<!DOCTYPE html>
<html>
<head>
    <title>Problems with datagrid</title>
    <meta charset="utf-8">

    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/resources/dojo.css">
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dijit/themes/claro/claro.css" media="screen">
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/grid/resources/Grid.css">
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/grid/resources/claroGrid.css">
</head>
<body class="claro">

<div id="outer">&nbsp;</div>
<div><div id="inner">&nbsp;</div></div>

<script>
    dojoConfig = {
        isDebug: true,
        async:   true,
        has: {
            "dojo-firebug": true,
            "dojo-debug-messages": true
        }
    };
</script>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js" data-dojo-config="async: true"></script>
<script>
    require([
        "dojo/parser",
        "dojo/ready",
        "dojo/store/Memory",
        "dojo/data/ObjectStore",
        "dojox/grid/DataGrid"
    ], function(parser, ready, Memory, ObjectStore, DataGrid){

        createOuterGrid = function(){
            var data = [{id:12,name:'outer'},{id:13,name:'blabla'}];
            var dataStore = new ObjectStore({ objectStore:new Memory({ data:data }) });
            var grid = new DataGrid({
                store:dataStore,
                items:data,
                structure:[
                    {name:"ID", field:"id", width:"20%"},
                    {name:"Name", field:"name", width:"80%"}
                ]
            }, "outer");
            grid.startup();
        };
        createInnerGrid = function(){
            var data = [{id:12,name:'inner'},{id:13,name:'blabla'}];
            var dataStore = new ObjectStore({ objectStore:new Memory({ data:data }) });
            var grid = new DataGrid({
                store:dataStore,
                items:data,
                structure:[
                    {name:"ID", field:"id", width:"20%"},
                    {name:"Name", field:"name", width:"80%"}
                ]
            }, "inner");
            grid.startup();
        };

        parser.parse();
        ready(function(){
            createOuterGrid();
            createInnerGrid();
        });
    });
</script>
</body>
</html>

有没有办法让这项工作?我应该在某个地方登录吗?

我最初在这里发布了我的问题: dojo stackcontainer contains custom widget that uses datagrid, but dategrid not showing up 但后来我不知道这是因为数据网格应该是身体的直接子女。

1 个答案:

答案 0 :(得分:0)

网格需要父级高度。记录在某处。

设置内部Div父母的高度将会发挥魔力。

就是这样,外部div的父母就是身体。