动态生成button、content、windowcontainer，生成了代码但是不显示

bobo456123

项目需要动态生成button、content、windowcontainer，一个button对应到一个content和一个windowcontainer，实际就是button滑动切换到指定的windowcontainer中嵌套页面内容。界面如下：


button是根据ajax获取的json来生成，然后对应自动生成的content、windowcontainer，他们都拥有同样的id号，例如：
button_22、content_main_22、windowcontainer_22。
具体代码如下：buttongroup的json数据：

1. var options_node = {
   
2.                         defaultValues : [ {
   
3.                                 nodeid : "3",
   
4.                                 nodename : "新闻",
   
5.                                 type : "list_art_scrollimg"
   
6.                         }, {
   
7.                                 nodeid : "4",
   
8.                                 nodename : "快讯",
   
9.                                 type : "list_art_noscrollimg"
   
10.                         }, {
    
11.                                 nodeid : "5",
    
12.                                 nodename : "校务",
    
13.                                 type : "list_album"
    
14.                         }, {
    
15.                                 nodeid : "6",
    
16.                                 nodename : "专科",
    
17.                                 type : "list_art_scrollimg"
    
18.                         }, {
    
19.                                 nodeid : "7",
    
20.                                 nodename : "专题网站",
    
21.                                 type : "list_art_scrollimg"
    
22.                         }, {
    
23.                                 nodeid : "8",
    
24.                                 nodename : "教育科研",
    
25.                                 type : "list_art_scrollimg"
    
26.                         }, {
    
27.                                 nodeid : "9",
    
28.                                 nodename : "德育纵横",
    
29.                                 type : "list_art_scrollimg"
    
30.                         }, {
    
31.                                 nodeid : "10",
    
32.                                 nodename : "后勤管理",
    
33.                                 type : "list_art_scrollimg"
    
34.                         }, ]
    
35.                 };

复制代码

动态生成buttongroup中按钮

1. var parentNode = this.comp("buttonGroup_top");
   
2.                 if (parentNode) {
   
3.                         $.each(options_node["defaultValues"], function(i) {
   
4.                                 var xid = "button_top_" + $(this)[0]["nodeid"];
   
5.                                 var label = $(this)[0]["nodename"];
   
6.                                 if (i == 0) {
   
7.                                         var classname = "btn btn-link btn-only-label active";
   
8.                                 } else {
   
9.                                         var classname = "btn btn-link btn-only-label";
   
10.                                 }
    
11.                                 var flag = {
    
12.                                         xid : xid,
    
13.                                         label : label,
    
14.                                         target : "content" + $(this)[0]["nodeid"],
    
15.                                         'class' : classname
    
16.                                 };
    
17.                                 var button = new Button(flag);
    
18.                                 // 把创建的button添加到指定父节点中
    
19.                                 justep.Component.addComponent(parentNode.$domNode, button);
    
20.                         });
    
21.                         get_btngroup_width(".btn-group-top");
    
22.                 }

复制代码

动态生成内容区域content

1. // 动态生成内容区域content
   
2.                 var parentNode = this.comp("contents2");
   
3.                 var me = this;
   
4.                 if (parentNode) {
   
5.                         $.each(options_node["defaultValues"], function(i) {
   
6.                                 var xid = $(this)[0]["nodeid"];
   
7.                                 var newContent = me.comp("contents2").add({
   
8.                                         xid : "content_main_" + xid
   
9.                                 });
   
10.                                 var windowcontainer = new WindowContainer({
    
11.                                         xid : "windowcontainer" + xid,
    
12.                                         parentNode:newContent.$domNode[0],
    
13.                                         src : require.toUrl("$UI/ESchool/Template/list_art_scrollimg.w"),
    
14.                                         onLoadError : function(err) {
    
15.                                                 alert("加载出错");
    
16.                                                 err.cancel = false;
    
17.                                         }
    
18.                                 });
    
19.                         });
    
20.                 }

复制代码

启动运行后，打开开发者工具中，button、content、windowcontainer的代码都已经自动生成，但是页面上不显示第一个windowcontainer中的内容，这是为什么？

bobo456123

已经解决，点击but切换到指定content，content中嵌套windowcontainer，问题是在指定windowcontainer 的parentNode字段时，应该设置为：newcontent.$domNode[0]而不是newcontent.$domNode，wex5对象转到jquery对象时的数据格式，还需要再研究研究。贴上代码吧：

1. $.each(options_node["defaultValues"], function(k) {
   
2.                                 var xid = options_node["defaultValues"][k]["nodeid"];
   
3.                                 var nodename = options_node["defaultValues"][k]["nodename"];
   
4.                                 var type = options_node["defaultValues"][k]["type"];
   
5. 
   
6.                                 var classname = "";
   
7.                                 if (k == 0) {
   
8.                                         classname = "btn btn-link btn-only-label active";
   
9.                                 } else {
   
10.                                         classname = "btn btn-link btn-only-label";
    
11.                                 }
    
12. 
    
13.                                 // 动态创建button
    
14.                                 var button = new Button({
    
15.                                         xid : "button" + xid,
    
16.                                         label : nodename,
    
17.                                         target : "content_main_" + xid,
    
18.                                         class : classname,
    
19.                                         parentNode : me.getElementByXid("buttonGroup_top")
    
20.                                 });
    
21. 
    
22.                                 // 动态创建content
    
23.                                 var newcontent = me.comp("contents2").add({
    
24.                                         xid : "content_main_" + xid
    
25.                                 });
    
26. 
    
27.                                 // 动态创建windowcontainer
    
28.                                 var windowcontainer = new WindowContainer({
    
29.                                         xid : "windowcontainer" + xid,
    
30.                                         parentNode : newcontent.$domNode[0],
    
31.                                         src : require.toUrl("$UI/ESchool/Template/" + type + ".w")
    
32.                                 });
    
33.                         });

复制代码