Understanding web components

External graphical components can be integrated into forms by using the WEBCOMPONENT form item type.

A WEBCOMPONENT form field is a form element that defines an area in the form layout to hold an external component, typically not available as a native widget on the front-end platform.

Web components are designed for a specific need, and usually have advanced and powerful features which can bring added value to your applications. For example, you can find chart and graph widgets, calendar widgets, drawing widgets, and more. Such specialized widgets are not part of the standard GUI toolkits used by Genero front-ends. They need to be integrated as external components.

Important: Depending on the type of front-end, the web components can have limitations: When using native front-ends (GDC, GMA, GMI), the web components are implemented with a "webview" widget, which is not a full-featured web browser.

The main web component limitations on native front-ends are:

lack of plugin support,
less accurate javascript engine,
lack of advanced html+css features.

Some web components are free, and some are licensed, so you should take the cost into account before integrating a new web component in your application.

Web components can be implemented with two different techniques:

Using an URL specification, by setting the URL as value of the WEBCOMPONENT field at runtime. This is the easiest way to implement a web component. The widget is controlled with URL values by the program, but requires some additional coding to handle URLs, instead of flat field values.
Using an gICAPI object (based on JavaScript™), by defining the COMPONENTTYPE attribute in the form file. This kind of web component requires some JavaScript coding, to write a form field "plugin", which is usable in a normal dialog instruction, that behaves as all the other widgets in terms of value setting/getting.

The content and/or behavior of a web component can be controlled in the program code by using the field value. To detect events inside the web component, the program dialogs must implement an ON CHANGE control block, that will be fired immediately after a user action on the web component.