how to call function on external file?

Webix JS
#1

I have a simple html file with a function called add1 and a button. The file includes a separate javascript file. All that file has is 1 function called add2. if I call both add1 and add2 from the main file there is no problem. Everything works as expected. If however I use webix button to call the external function add2, it doesn’t work. i can only call add2. Here is some snipped of code

//main file
<script>
    function add1(x, y) {
    	console.log(x + y);
    }
    
    webix.ready(function() {
    	gridb = new webix.ui({
    		container : "testB",
    		view : "button",
    		value : "ADD",
    		align : "center",
    		click : "add(100, 200);",  //changing to click : "add2(400, 600);" does not works
    		width : 200
    	});
    });
</script>

//imported file
function add2(x, y) {
  	console.log(x + y);
}

In the example above I will see in the console 33 as expected. However, if I change the webix button click line to the external function add2 (click : “add2(400, 600);”, It simply doesn’t work. If however, I put add2(400, 600); inside of add1 this does works. Why??

    function add1(x, y) {
    	console.log(x + y);
            add2(1000, 2000); //This works
    }
#2

sorry, the line where it says click : “add(100, 200);”, //changing to click : “add2(400, 600);” came incomplete. It should had said that changing add1 to add2 does not works. Also, the code should had said add1 not just add.

#3

Problem must be caused by the visibility scope
When you are using

click : "add(100, 200);"

Code is evaluated in the global scope and will work correctly only if function add is globally visible.

If you have something like

webix.ready(function() {
      function add2(){ ... }

function add2 is defined inside of separate scope and will not be visible for the above click handler.