0

我在自定义小部件中呈现数据网格时遇到问题。

我能够查明问题所在：不是身体直接子级的数据网格不能正确渲染。

展示：

<!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 包含使用数据网格的自定义小部件，但没有显示日期网格， 但后来我不知道这是由于数据网格应该是主体的直接子级这一事实引起的。

4

1 回答 1

0

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

为内部 Div 父级设置一个高度会变魔术。

这就是发生在外部 div 的父级是 body 的情况下。

于 2013-08-26T20:04:50.790 回答