How to access underlying HTML elements in WebIX controls?

Let’s say I am using a WebIX form with a bunch of WebIX controls. One of the controls (ui.text) needs some very special behavior - let’s say, a very specialized “mask” behavior: as certain key are typed, they are not displayed, changed to something else, trigger cursor movement, etc.

This behavior is not achievable with the ui.text onKeyPress event, but this is OK. I can write this myself by adding event handlers to the HTML Input control (Edit Box). I just need the access to the Edit Box - how can I get that access?

The ID that I assign to the ui.text is actually the “view_id” attribute of a DIV element that has the Edit Box as a child. I do not want to call a jQuery function to traverse the whole DOM tree to find an element by “view_id”. Is there an efficient way to access the underlying HTML element?

BTW, if I inspect the HTML element, i get this:

< input type=“text” style=“width: 252px; text-align: left;” value=“abcde” id=“1443722509075” >

This is my Edit Box, it looks like some random number was used as the ID. I just need access to that random ID (“1443722509075”), as associated with the WebIX control that I created.

Try something as in:

{ 
   view: "text",
   on:{
        onAfterRender: function(){
              var inputNode = this.getInputNode();
              // your code here
        }
   }
}

hi
my issue also related with this topic. what i am trying to do is i have one div with view_id but i am not able to change css using this view_id.
need help on this