How to target an icon to add jquery click?

Webix JS
1

Hi All:
For the code below, I have a hidden div (ie. display:none) of some ipsum text… $(“helpIcon”). is coming up undefined, so how do I correctly target { view:“icon”, icon:“question-circle”, id:“helpIcon”}

var iconHelp = "<span class='webix_icon fa-question-circle'></span>";
 var list = [];
 var toolbar = {
			  view:"toolbar",
			  elements:[
		      { 
					  view:"richselect", width:170, labelWidth:90,
					  label: 'View Pages', labelAlign:"left",
					  value:1, options:[
						  { id:1, value:"4"   }, 
						  { id:2, value:"5"   }, 
						  { id:3, value:"6"   }
					  ],
                		on:{
						onchange:function(){
							pagerSize = this.data.text;
							$$("pagerA").define("size", pagerSize);
							$$("chk").refresh();
						}
				  }
              },
				{ 
					view:"richselect", width:170, id:"batchAction", labelWidth:90,
					labelAlign:"left",
					value:1, options:[
						{ id:1, value:""   }, 
						{ id:2, value:"red background"   }, 
						{ id:3, value:"green background"   }, 
						{ id:4, value:"blue background"   }, 
						{ id:5, value:"yellow background" }
					],
					on:{
						onchange:function(){
                          		alert($$('batchAction').getText());
 
						}
					}

				},
			    { view:"search", align:"right", placeholder:"Search by keyword", id:"searchfilter", inputWidth: 220},
                { view:"icon", icon:"question-circle", id:"helpIcon"}
			  ]
      };


                    
			webix.ui({
				container:"areaA",
				rows:[ toolbar ]
			})

        $("helpIcon").click(function() {
            webix.ui({
                    type:"space",
                    width:400,
                    height:150,
                    rows:[
                    {view:"template",
                    content:"help_info_container"}
                    ]
            });
        });
2

Check
http://webix.com/snippet/fea6ca49

3

The position of popup is at top left corner. When I put in center, it goes to the center of the screen… I would like that popup to be position below the help button. So the popup should hug the right side of the window, even when the window shrink and expands… How to achieve this?

4

You can use show method of popup. Just call it with a button object and popup will be shown next to the button in question

http://webix.com/snippet/fbf340af

5

That placed where I wanted. The only problem is that the popup goes to the center when I shrink or expand the window myself. Is there a way to anchor to the right side of the window?

6

You can assign code to resize handler. It can be used to readjust popup position

http://webix.com/snippet/8977f0cc

7

that works. thank you.