Change the Kendo UI Vue dynamically

[Pablo]

We have a multilanguage application and we need to change the Kendo UI for Vue language dynamically.

 

We are found a Angular example https://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/AngularJS/angular-dynamic-language-change, but this way is not available with Vue.

 

For our custom message with use vue-i18n plugin, but we want to use the kendo.messages.xx-XX.js files, but only (the last) is active.

 

Thks.

 

 

[Nencho]

Hello Pablo,

In order to achieve the desired functionality, you would need to manually set the messages for the used components. base on the preferences. In other words, you should load the needed scripts for the language and set it as demonstrated below:

var that = this;
      var selectedLang = this.$refs.dl.kendoWidget().value();
       // be de-DE or en-US...
      $.getScript("https://kendo.cdn.telerik.com/2018.3.1017/js/messages/kendo.messages." + selectedLang + ".min.js", function() {
        var lb = that.$refs.lb.kendoWidget();
        lb.setOptions({
          messages: kendo.ui.ListBox.fn.options.messages
        });
      });

https://stackblitz.com/edit/jasep3-tdv4vz?file=index.js

Regards,
Nencho
Progress Telerik