将dgrid放入TitlePane时遇到问题

时间:2014-09-10 19:11:44

标签: dojo dojox.grid.datagrid

我试图将dojo dgrid放入标题栏中,如下所示:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Tutorial: Hello dgrid!</title>
        <link rel="stylesheet" href="/dojo/dojo/resources/dojo.css">
        <link rel="stylesheet" href="/dojo/dgrid/css/dgrid.css">
        <link rel="stylesheet" href="/dojo/dgrid/css/skins/claro.css">
        <link rel="stylesheet" href="/dojo/dijit/themes/claro/claro.css">
    <!-- this configuration assumes that the dgrid package is located
         on the filesystem as a sibling to the dojo package -->
    <script src="/dojo/dojo/dojo.js">
        data-dojo-config={async: true, parseOnLoad: true}
        </script>
    <script>
        require(["dijit/TitlePane", "dgrid/Grid", "dojo/domReady!"], function(TitlePane,Grid){
    var data = [
        { first: "Bob", last: "Barker", age: 89 },
        { first: "Vanna", last: "White", age: 55 },
        { first: "Pat", last: "Sajak", age: 65 }
    ];

    var grid = new Grid({
        columns: {
            first: "First Name",
            last: "Last Name",
            age: "Age"
        }
    }, "grid");
    grid.renderArray(data);
});
    </script>
</head>
<body class="claro">
<div data-dojo-type="dijit/TitlePane" data-dojo-props="title: 'Pane #1'">
    <div id="grid"></div>
</div>
</body>
</html>

我只是没有让TitlePane显示出来。网格很好地显示出来。我在这里做错了什么想法?

最终,我将生成一个包含多个网格的页面,并且看起来很好的方式将网格放入容器......

1 个答案:

答案 0 :(得分:1)

当我输入“dojo / parser”时,它对我有用:

<script>
        require(["dijit/TitlePane", "dojo/parser","dgrid/Grid", "dojo/domReady!"],
        function(TitlePane, parser, Grid) {
            parser.parse();
            var data = [{
                first : "Bob",
                last : "Barker",
                age : 89
            }, {
                first : "Vanna",
                last : "White",
                age : 55
            }, {
                first : "Pat",
                last : "Sajak",
                age : 65
            }];

            var grid = new Grid({
                columns : {
                    first : "First Name",
                    last : "Last Name",
                    age : "Age"
                }
            }, "grid");
            grid.renderArray(data);
        });
</script>
相关问题