dynamic ui via json from server

How can I define a tabview to load the body UI from a json string loaded from the server?

https://webix.com/snippet/e4281b2a

You can use vm template for that. And inside Vm template you can make webix datatable

Thanks! vm template? can you give a sample?

ps it could be any webix component like form, tabview, etc. that i want to load from the server (the UI is dynamically created based on different plugins)

you can write webix code in suppose webix.vm
after that in server side -

import org.apache.velocity.Template;
import org.apache.velocity.app.VelocityEngine;
import org.apache.velocity.context.Context;
import org.apache.velocity.runtime.RuntimeConstants;
import org.apache.velocity.servlet.VelocityServlet;

public class MasterVelocityServlet extends VelocityServlet {
public Template handleRequest( HttpServletRequest request,
HttpServletResponse response,
Context context ) {
Template template = null;

	 VelocityEngine ve = new VelocityEngine();
	  try {
		 ve.setProperty(RuntimeConstants.RESOURCE_LOADER, "file"); 
		 ve.setProperty(RuntimeConstants.FILE_RESOURCE_LOADER_PATH, "path of .vm file");
		 template = ve.getTemplate("webix.vm");
	  } catch( Exception e ) {
		  System.err.println("Exception caught: " + e.getMessage());
	  }
	return template;
	
}

and after that call MasterVelocityServlet where you want to show the output

ok, but how can i load the result string a component in javascript, see my sample.

you want the datatable here body: {
// load a json datatable definiton from the server???
}

with data from backend
???

I want the data AND definition (columns, etc) and for a form i want the elements returned as json from server

Hello,

With Datatable it’s possible to provide both configuration and data in the serverside url. Server should return:

{
  config: {
        columns:[..], height:500, //etc
  },
  data:[...]
}

Please, check the following sample.

For other components you will need to issue an Ajax request before UI initialization:

webix.ajax(url, function(text, data){
	webix.ui(/*server response parsed to json*/);	
});

If you are speaking about a Webix Jet-based app, please check the related demo on Github , namely its data.js file.

https://forum.webix.com/discussion/comment/16774

The tabs should be visible directly but after clicking on the tab it should load the content from the server. If I understand it correctly, you can only do that in event “onViewChange”, like in this example… https://webix.com/snippet/d234fbd8

ps. maybe it’s an option to extend the tabview with deferred loading via an url

@mdissel
custom deferred layout can be created:
https://webix.com/snippet/29b08697

Nice! This can be applied to every layout?

Please add it to the default webix component set :wink:

This can be applied to every layout?

you need to define custom one (form, layout)
the only disadvantage is impossibility of functions deserialization

Yes, or use something like described here