this.app -- TypeError: this.data is null

Hi,

I try to change language and locales in onchange Method, language change correctly, but locales don’t work, also console throw this error:

TypeError: this.data is null

Please, why this code show this error in onchage Method of combo?

Why this.app is null in onchange event ?

Thanks in advance.

import { JetView, plugins, JetApp } from "webix-jet";
import { dataLanguages } from "../models/records";
import  MenuView  from "views/menuView";

export default class TopView extends JetView{

    config() {
        
        const lang = this.app.getService("locale").getLang();
        const _ = this.app.getService("locale")._;
        
        var ui = {
            id: "all",
            rows: [
                { view: "toolbar", padding: 3, elements: [
                        {
                            view: "combo",
                            id: "combolanguage",
                            name:"combolanguage",
                            value: lang,
                            width:110,
                            options: {
                                body: {
                                    data: dataLanguages,
                                }
                            }
                        }
                    ]
                },
                {
                    cols: [
                       
                        MenuView,
                        {  $subview: true }
                    ]
                }
            ]
        }
        return ui;
    }
   
    ready() {

         $$("combolanguage").attachEvent("onChange",  (newv, oldv) => {
             
            const langs = this.app.getService("locale");
            webix.i18n.setLocale(newv);
            langs.setLang(newv);
            
        });
    }

    destroy()
    {
       
    }
}

This is the error when combo change, but language is change correctly, locales no change.

[Show/hide message details.] TypeError: this.data is null[Learn More] webix_debug.js:11601:1
removeCss
webix_debug.js:11601:1
Bg
webix_debug.js:13987:19
unselectAll/<
webix_debug.js:14064:2
each
webix_debug.js:638:6
unselectAll
webix_debug.js:14061:7
Bg
webix_debug.js:13984:14
select
webix_debug.js:14022:7
webix_list_item
webix_debug.js:16966:10
Yc
webix_debug.js:6816:58
Sc
webix_debug.js:6717:3
webix.bind/<
webix_debug.js:235:2

The setLocale method results in view repainting, which involves destruction of all elements inside of the current view. As result the combo view is destroyed during processing onChange, which causes the above issue.

You can try to use code like next

    ready() {

         $$("combolanguage").attachEvent("onChange",  (newv, oldv) => {
            webix.delay(() => {
                const langs = this.app.getService("locale");
                webix.i18n.setLocale(newv);
                langs.setLang(newv);
            })
        });
    }

The above code will delay the language change processing, so code will be able to finalize the onChange processing before the full view repainting.

Thanks so much!!!