在 dojo TabContainer 中添加其他选项卡的按钮

Question

基本上我有一个 JSP 页面，点击按钮后它应该创建一个新选项卡，href 设置为 ${submission.id} 变量是什么。但是单击该按钮不会生成任何选项卡。我试过查看 dojo 教程和阅读文档，但我不知道我的错误是什么。

<script>
dojoConfig = {
    async : true,
    parseOnLoad : true
}
</script>
<script src="js/dojo/dojo.js"></script>
<div id="tabPanel" data-dojo-type="dijit/layout/TabContainer" style="width: 100%; height: 100%;" data-dojo-props="region: 'center'">
<div data-dojo-type="dijit/layout/ContentPane" title="Home" data-dojo-props="selected: true">
<button data-dojo-type="dijit/form/Button" type="button"
onclick="registry.byId('tabPanel').addChild(new ContentPane({
title:'test',
closable:true,
href:'submissions/${submission.id}'
}), 6);">Details</button>
</div>
</div>
<script>
require([ //Layout and Menu
         "dojo/parser",
         "dojo/dom",
         "dijit/layout/BorderContainer",
         "dijit/layout/ContentPane",
         "dijit/layout/TabContainer",
         "dijit/form/Button",
         "dojo/domReady!"
         ], function(parser) {
            parser.parse();
});
</script>

Answer 1

您的页面似乎实际上没有 ID 为 tabPanel 的小部件。您的 TabContainer 具有 class tabPanel，但它还需要具有 id tabPanel为了你的 registry.byId 电话找到它。

Answer 2

在 onclick 属性中调用的代码没有对所需模块的引用。您可以尝试以下方法。

<button data-dojo-type="dijit/form/Button" type="button"
onclick="createTab();">Details</button>

<script>
function createTab(){
   require([ //registry and ContenPane
         "dijit/registry",
         "dijit/layout/ContentPane"
         ], function(registry,ContentPane) {

            registry.byId('tabPanel')
            .addChild(new ContentPane({
                 title:'test',
                 closable:true,
                 href:'submissions/${submission.id}'
              }),6);
    });
}
</script>

在 dojo TabContainer 中添加其他选项卡的按钮

Button to add additonal tabs in dojo TabContainer

javascript

dojo