webix.ui method callback

Webix JS
#1

I would like to execute a function only after webix.ui has completed (a callback).

webix.ui({ view: “datatable”, … }).then(function(){…});

Please demonstrate the correct syntax to achieve this. Thanks.

#2

webix.ui({…}).attachEvent(“onAfterRender”, function(){…});

This accomplishes what I want.

#3

Yep, you are correct

webix.ui method is sync, so you can take it result and use it directly without using promises.

#4

But please beware that such line (webix.ui({…}).attachEvent(“onAfterRender”, function(){…}):wink: will define a function that is called every time when the datatable is rendered. It includes all CRUD operations, selection, resizing, etc…

And it is not a reliabale webix.ui “callback” as the function itself is defined after the ui has been initialized.

The solution is to move the event handler definition to a configuration object (ensures that the function is executed right after initialization) and to wrap it into the webix.once helper (ensures that the function is called only once after the initialization skipping all further re-rendering):

webix.ui({
   view:"datatable",
   on:{ 
      "onAfterRender": webix.once(function() ...})
   }   
});

Check the related snippet, please (try selecting records in all datatables): https://webix.com/snippet/957239ce