Question

我正在尝试生成TabContainer并以编程方式将其添加到Dialog dijit中：

    gridsDiv = domConstruct.create('div');
gridsDiv_inner = domConstruct.create('div', { id: 'gridsDiv_innerId', style: "width: 600px; height: 600px" });

var tc = new TabContainer({
    style: "height: 100%; width: 100%;"
}, "gridsDiv_innerId"
);

var cp1 = new ContentPane({
    title: "Food",
    content: "We offer amazing food"
});

tc.addChild(cp1);

var cp2 = new ContentPane({
    title: "Drinks",
    content: "We are known for our drinks."
});

tc.addChild(cp2);
tc.startup();
gridsDiv.appendChild(gridsDiv_inner);

dialogWindow = new Dialog({
    title: 'Attribute data',
    content: gridsDiv,
    'class': 'nonModal',
    style: "width: 600px"
});

上面的代码返回一个空的Dialog。我需要在this example中通过标记实现相同的功能，但我需要动态生成标签及其内容。

Answer 1

对于dojo Dialog，内容只能是文本。没有其他的。如果使用href，则url必须将文本作为响应返回。这是规则。这里，tab容器对象-tc是一个DOM节点，不能使用其content属性在Dialog中设置。相反，选项卡容器需要以编程方式附加到Dialog。

var tc = new dijit.layout.TabContainer({
    style: "height: 100%; width: 100%;"
});
var cp1 = new ContentPane({
    title: "Food",
    content: "We offer amazing food"
});

tc.addChild(cp1);

var cp2 = new ContentPane({
    title: "Drinks",
    content: "We are known for our drinks."
});

tc.addChild(cp2);

var d = new dijit.Dialog({style: "height: 50%; width: 60%;"});
d.addChild(tc);
d.show();

＆＃34; addChild＆＃34;方法是将DOM对象附加到Dialog的containerNode（contentPane）。这必须用于编程目的。（同样我们有＆＃39; removeChild＆＃39;方法反之亦然。）

以编程方式将TabContainer添加到Dialog

1 个答案: