动态生成 popMenu

chaierkid

build version : 5.3.6.5569 build time : 2016.10.21 19:17:28

动态生成 popMenu


类似grid 那样，new Grid （option） ,放到某个指定的位置中；

动态生成popMenu ，并且动态生成下拉选项；

jishuang

动态创建组件参考http://doc.wex5.com/?p=4202#2.2
动态添加菜单项参考/UI2/system/components/justep/popMenu/demo/base.w

chaierkid

jishuang 发表于 2017-7-4 17:28
动态创建组件参考http://doc.wex5.com/?p=4202#2.2
动态添加菜单项参考/UI2/system/components/justep/popM ...

组件动态创建成功了。。。。
var window = self.getElementByXid("window");
                if (window) {
                    var option = {
                        xid : "popMenuFromSetting",
                        anchor : "moreButton",
                        parentNode : window,
                        'class':"x-popMenu",
                        direction:"left-bottom",
                        dismissible:"true",
                        autoHidable:"true"
                    };
                    popMenu= new PopMenu(option);
                }

但是动态添加菜单项时：
demo中：
var menu = this.comp("menu1");
                menu.addItem({
                        label : "Item" + count++
                });

但是动态创建的popmenu ，menu没有xid，这个要怎么在动态创建popmenu时，设置？

jishuang

参考

1.         Model.prototype.button18Click = function(event){
   
2.                 var parentNode = this.getElementByXid("top1");       
   
3.                
   
4.                 var option = {
   
5.                         parentNode : parentNode,
   
6.                         xid : 'popMenu1',
   
7.                         class : 'x-popMenu',
   
8.                         anchor : 'button18',
   
9.                         dismissible : true,
   
10.                         autoHidable : true,
    
11.                         opacity : '0.1'
    
12.                 };
    
13.                
    
14.                 var popMenu1= new popMenu(option);
    
15. 
    
16.                 var menu = popMenu1.getInnerMenu().addItem({
    
17.                         label : "Item"
    
18.                 });
    
19.                 popMenu1.show();
    
20.         };
    

复制代码

chaierkid

jishuang 发表于 2017-7-5 14:48
参考

item 已经添加上了，同时我也绑定了事件，但是现在的情况是，在我生成组件时，就会触发一次bind-click事件：
for(var i=0;i<jsonresult.length;i++){
                                                                var column = jsonresult;
                                                            menu.addItem({
                                                        label : column.fFileComment,
                                                       'bind-click':"window.open('"+column.fFildName+"')"
                                                    });
                                                        }

不应该这么绑定么？然后我换写法为
for(var i=0;i<jsonresult.length;i++){
                                                                var column = jsonresult;
                                                            menu.addItem({
                                                        label : column.fFileComment,
'bind-click':"this.itemClick("+column.fFildName+")"
                                                    });
                                                        }
更多这个按钮都不显现了；

然后，定义方法后调用，同样自动执行一次，看论坛说不能写参数，但是如果不写参数，我参数怎么传递？：
for(var i=0;i<jsonresult.length;i++){
                                                                var column = jsonresult;
                                                            menu.addItem({
                                                        label : column.fFileComment,
                                                        'bind-click':inputExt.itemClick(column.fFildName)
                                                     //论坛说要写成 'bind-click':inputExt.itemClick就不会自动执行，但是不写参数，参数怎么传递？
                                                    });
                                                        }

jishuang

1.         Model.prototype.button18Click = function(event) {
   
2.                 var parentNode = this.getElementByXid("top1");
   
3. 
   
4.                 var option = {
   
5.                         parentNode : parentNode,
   
6.                         xid : 'popMenu1',
   
7.                         class : 'x-popMenu',
   
8.                         anchor : 'button18',
   
9.                         dismissible : true,
   
10.                         autoHidable : true,
    
11.                         opacity : '0.1'
    
12.                 };
    
13. 
    
14.                 var popMenu1 = new popMenu(option);
    
15. 
    
16.                 var menu = popMenu1.getInnerMenu().addItem({
    
17.                         label : "Item",
    
18.                         xid : "buttonMenu1"
    
19.                 });
    
20. 
    
21.                 this.comp("buttonMenu1").on("onClick", function(event) {
    
22.                         alert(event.source.get('label'));
    
23.                 });
    
24.                 popMenu1.show();
    
25.         };

复制代码

chaierkid

jishuang 发表于 2017-7-5 16:57

只能这么写么？
这个对我的业务场景不合理呀？
我需要循环additem的，那如果我有多个item，就需要写多个
this.comp("buttonMenu1").on("onClick", function(event) {
                        alert(event.source.get('label'));
                });

jishuang

可以直接这样写

1.         var menu = popMenu1.getInnerMenu().addItem({
   
2.                         label : "Item",
   
3.                         xid : "buttonMenu1",
   
4.                         'onClick' : this.test1
   
5.                 });
   
6. 
   
7.         Model.prototype.test1 = function(event){
   
8.           alert(2);
   
9.         }

复制代码

参数是按钮的event，没有其他的参数

如果要在click中中获取什么，就直接写方法,如下：

1.                 var menu = popMenu1.getInnerMenu().addItem({
   
2.                         label : "Item",
   
3.                         xid : "buttonMenu1",
   
4.                         'onClick' : function(event){
   
5.                           window.open('"+column.fFildName+"')
   
6.                         }
   
7.                 });

复制代码