Question

我的主容器是一个TabContainer，在选项卡中我显示了各种自定义小部件。最常见的格式是BorderContainer，其顶部为按钮和搜索选项，中间部分为网格。这是我的基本列表视图。所以，我的模板是一个带有BorderContainer的div，它有空的div来插入网格。我的问题是，当放置在中心div中时，我无法显示网格。到目前为止，我一直在使用一种方法将网格附加到Tab容器中（实际上在BorderContainer下面，并将BorderContainer的大小调整为Top部分的大小。因此，网格实际上位于BorderContainer下面。

以下是模板的一个简单示例：

<div id="BorderContainer_BW" style="height: 500px; width: 100%"
data-dojo-type="dijit.layout.BorderContainer"
data-dojo-attach-point="BorderContainer_BW"
data-dojo-props="design:'headline'">

<div id="actionBar_BW" data-dojo-type="dijit.layout.ContentPane"
    data-dojo-props="region:'top'">
    <table id="buttonBar_BW" style="width: 100%">
        <tr>
            <td id="BBL_BW">
                <button id="Button_Refresh_BW" style="float: left;"
                    data-dojo-type="dijit.form.Button" type="button"
                    style="padding:5px;" data-dojo-attach-point="refreshButton"
                    data-dojo-attach-event="onClick:applyRefresh">Refresh</button>
            </td>
        </tr>
    </table>
</div>

<!-- center section of borderContainer -->
<div id="BasicGridArea" data-dojo-type="dijit.layout.ContentPane"
    data-dojo-attach-point="basicGridNode"
    data-dojo-props="region:'center'"></div>
</div>

网格在构造函数中创建，如果附加到Tab，则显示OK。由于网格是自定义小部件的一部分，我想将网格放在widget.js和这是一个尝试的例子：

postCreate : function() {
    this.inherited(arguments);
    var gridNode = this.get("basicGridNode");
    console.log("center pane = " + gridNode);  // to see if it is undefined...
    this.theGrid.placeAt(gridNode);
    },
startup : function() {
    this.inherited(arguments);
    this.theGrid.startup();
    },

创建和启动网格的主js脚本文件中的代码是：

gPersonList = new com.company.etc.TheWidget(dataIn);
dojo.byId("Tab1").appendChild(gPersonList.domNode);  // place widget in the tab
gPersonList.startup();  // should start both widget and grid

这是有效的解决方法，但显然是错误的！

dojo.byId("Tab1").appendChild(gPersonList.domNode);
dojo.byId("Tab1").appendChild(persongrid.domNode); (appending the grid itself after the widget)
persongrid.startup();

我相信我错过了一些简单的步骤，但到目前为止还无法解决这个问题。

Answer 1

这是我发现的......我在我的主.jsp文件中有这个：

<style type="text/css">
#grid {
    width: 100%;
    height: 100%;
}
</style>

猜猜它没有得到认可。我仔细观察并在动作栏下方看到一组非常薄的线条，所以它很可能在中心...所以，我在创建网格时添加了“autoHeight：true”，现在它出现了。

这确实提出了几个问题......为什么我的主.jsp文件中的样式没有得到识别？关于自定义小部件的一般问题，如何找到并加载css文件？我需要添加：

"dojo/text!./themes/PersonListWidget.css"

或者它会被找到，因为主题和模板位于同一目录级别......

网格未显示在窗口小部件中

1 个答案: