Form service components

Form service components are component that must be placed inside a form. This components display a set of options provided by a service and allow the user to select one or more of them. The form service components offered by OntimizeWeb are combo, list picker and radio.

All form service components in OntimizeWeb extend the OFormServiceComponent class, that is a subclass of OFormDataComponent. This class provides a set of methods and attributes inherited by all the form service components. This methods and attributes are explained on the API section of this page.

Parent keys

The parent-keys attribute allows the developer to define filtering keys used in the request the component makes to the server in order to populate its options. This filtering keys must be defined as a string, separating them with a semicolon ‘;’. The component will look for this keys on its parent form and in the route parameters in order to build the filter for querying.

parent-keys="factory_id;device_id"

In some cases, the values you will need for filtering the component request will be present in the parent form or the route parameter with a different name than the used in the component. For matching the component parent keys with these names, you can define an alias for each key you need separating the component parent key and its alias with two dots ‘:’.

parent-keys="factory_id:factory;device_id:device"

So far this is the behavior of the parent keys attribute in all the components OntimizeWeb defines.

Form service components extends this behaviour and go one step forward, they allow the component to look for a key value in the data of another service components. This can be done by defining the column you want to get between brackets ‘[]’. Check the example below.

<o-form>
    <o-combo attr="user" keys="user_id" columns="user_id;user_name;user_type"></o-combo>
    <o-combo attr="role" keys="role_id" columns="role_id;role_name;profile_id"
        parent-keys="user_type_id:user[user_type]"></o-combo>
</o-form>

In this example there is a form for linking users and roles, the roles the user may be linked with depend on the type of the user. The user type is part of the user information queried in the first combo. Notice that the the parent keys attribute for the roles combo has an alias and a column defined for the alias. This will make the roles component to look for the value of its parent key in the component with attr user and it will take the user_type column value as its parent key value.

The construction of dependant list-pickers is the same as done in the combo component. The first one is the selector of users, this will be the one that affects the second one.

<o-form>
    <o-list-picker attr="user" label="User" keys="user_id" columns="user_id;user_name;user_type"></o-list-picker>
    <o-list-picker attr="role" label="Role" keys="role_id" columns="role_id;role_name;profile_id"
        parent-keys="user_type_id:user[user_type]"></o-list-picker>
</o-form>

Name	Description	Default
columns string	Entity columns. Separated by ‘;’
description-columns string	Visible columns in text field
entity string	Service entity name
parent-keys string	Filtering keys. Separated by ‘;’. It is possible to use alias on the following way: compCol1:fk1;compCol2:fk2 where compCol1 and compCol2 are component columns and fk1 and fk2 are attributes from form fields. It is also possible to define a column next to the alias for getting that column value instead of the component value: compCol1:fk1[fkCol]
query-method string	Service method name for queries	query
query-on-bind no \| false \| yes \| true	Query table data on bind
query-on-event	A component event reference the component must listen to in order to perform its query. The component will wait until the event you choose is fired to perform the request of the data.
query-on-init no \| false \| yes \| true	Query table data on init	yes
query-with-null-parent-keys no \| false \| yes \| true	Indicates whether or not to trigger query method when the filter generated from parent-keys is null. The use of this attribute is not recommended when the component may request a big amount of information	no
separator string	Separation character between `description-columns` values
service string	JEE service path
service-type string	Injection token indicated in the provider of the service
set-value-on-value-change string	Form component attributes whose value will be set when the value of the current component changes due to user interaction. Separated by ‘;’. Accepted format: `attr \| attr:columnName`
sort ASC \| DESC	Indicates the order ascending or descending of the option values
static-data array	Static data for filling the table
translate yes \| no \| true \| false	Indicates whether or not to translate the option values	no
value-column string	Column of the entity from where the component will get its value
value-column-type string	`value-column` value type	int
visible-columns string	Visible columns. Separated by ‘;’