AwaitRedraw

You should understand that some API methods of the DHTMLX Suite widgets are implemented after the widget is rendered on the page. But in some cases this process may take some time, so you need to wait until the browser renders the needed component or its element.

To avoid this problem, you can use the dhx.awaitRedraw helper, which detects the rendering process and perform the desired code as soon as the component finally finishes its rendering.

The dhx.awaitRedraw helper returns a promise:

• promise - (function) a function to be executed

dhx.awaitRedraw().then(function() {
    // your code here
})

Related sample: Helpers. Await Redraw. Initialization

Here are real-life examples of how you can use the awaitRedraw helper:

• in Grid:

grid.events.on("AfterSelect", function (row, col) {
    dhx.awaitRedraw().then(function () {
        console.log(grid.selection.getCells().length);
    })
});

• in Window:

dhxWindowObj.attachHTML("<input id='"myInput"'/></input>");

dhxWindowObj.events.on("afterShow", function(id){ 
    dhx.awaitRedraw().then(() => {
        const el = document.getElementById("myInput");
        el.focus();
    })                      
});