Reload webix.ui

Webix JS
#1

While reloading (not browser page reload) webix.ui I always get Non unique view id: list-box

My code:

this.tableBox = new webix.ui({
container: ‘table-box’,
id: ‘list-box’,
view: ‘layout’,
type: ‘clear’,
animate: true,
rows: [
{
view: ‘template’,
id: ‘table-header’,
css: ‘headline’,
height: 30,
template: ‘—’
}
]
});

this.tablebox.addView({view: ‘datatable’,…});

I can use destructor for this.tablebox but then the page will be left empty… and I can not get anything… :frowning:

I please you for an example how to load the same webix.ui without getting non unique view error!!! Thanks a lot

regards
Michael

#2

I wrote a snippet Code Snippet. But there is no problem, in your snippet you always use //cdn.webix.com/pro/6.2/webix.js!! That means you always load 6.2!! But in GPL the error occurs :frowning:

I’m straggling with this dammed problem while get this error of non unique id. Is there a work around? Please for a help!

Michael

#3

Hi Michael,

Please check the updated snippet: Code Snippet

In order to recreate Webix views, you need to destroy them first.

In your function the new ‘list-box’ layout is created on each button click and the new ‘table-header’ child view is added to it. At the same time, Webix views are required to have unique IDs.

That is why the “non unique id” error occurs. You can see this error only in the GPL version because the Snippet tool loads non-minified sources for it, while for the PRO version the sources are minified. If you a licensed user, your downloaded PRO package contains both minified and full sources.

Maybe this article about debugging and error tracking with Webix can be useful for you: How to debug code and develop UI effectively with Webix UI Framework

As for the Webix version used in the Snippet tool. The tool itself is an application build on Webix v6.2, but the sandbox uses the latest Webix by default unless you select another version in the toolbar.

#4

Thanks a lot. Yes I understand. But do you have an example in which we add a dataTable view. And in my datatable I have some columns with options in which I directly load json options from a script like option: ‘load/some/json’. When first load the datatable will be build like a charm but when I destroy this datatable before. Then this datatable does not load anymore. I would like to load with datacollection. Do you have an example?

Thank you for all your work and keep going on to develop this great work!! Please!
Happy new Year and keep healthy.

Michael

#5

I found out that the options property in datatable column cause the error when datatable has been destructed and recreated again. That means all this columns with options:[] can’t be recreated. And this is bad for me :frowning: Even options:[] with empty array isn’t possible. I did this after data loading

let options = $$(table.name).getColumnConfig(‘city_id’).collection;
if(options.count() === 0){
let data = new webix.DataCollection({
scheme:{
$init:function(obj){
obj.size = obj.size*1;
}
}
});
data.load(’/Cities/getOptions’).then(function(obj){
options.parse(obj.json());
});
}

When I use options: null, then this column options isn’t defined. And when I declare options: [] then I can have dataCollections but I can’t reconstruct this datatable :frowning: (wimmer)

Sorry for this to carry the problem into the next year :neutral:

#6

Hello all.

I found the problem and corrected it. At least it is my fault. I have a put the columns into a variable like this.columns! So this var will kept, also after destructed()… :frowning: I set it into the method with let columns and so the var will always recreated. And this was it. Anyway. Everythings works fine so for.

Have a great Year

Michael