Combo Remote

In this guide, we will implement a parent-child relationship between two drop-down list elements of form. Child element's value will change according to parent element. Child drop-down list element takes its data by querying a table.

Create these following 2 tables. Then create their respective forms and grids using Form Wizard. And then, create a Page and Menu for both of them.

create table company (
company_id integer not null,
company_name character varying(1024) not null,
city_id integer,
lkp_country integer,
version_no integer NOT NULL DEFAULT 1,
insert_user_id integer NOT NULL DEFAULT 1,
insert_dttm timestamp without time zone NOT NULL DEFAULT ('now'::text)::timestamp without time zone,
version_user_id integer NOT NULL DEFAULT 1,
version_dttm timestamp without time zone NOT NULL DEFAULT ('now'::text)::timestamp without time zone,
CONSTRAINT pk_company PRIMARY KEY (company_id));
create sequence seq_company;
create table city (
city_id integer not null,
city_name character varying(1024) not null,
country integer,
version_no integer NOT NULL DEFAULT 1,
insert_user_id integer NOT NULL DEFAULT 1,
insert_dttm timestamp without time zone NOT NULL DEFAULT ('now'::text)::timestamp without time zone,
version_user_id integer NOT NULL DEFAULT 1,
version_dttm timestamp without time zone NOT NULL DEFAULT ('now'::text)::timestamp without time zone,
CONSTRAINT pk_city PRIMARY KEY (city_id));
create sequence seq_city;

Create a static lookup named lkp_country with these values.

Double click on country element of frm_city1 form and set its UI Component as Combo: Static Lookup with lkp_country as lookup.

Do the same for lkp_country element of form frm_company1.

Right click on city table and select Convert -> Table -> Lookup Query for Form Element.

Change SELECT section to following and click save.

x.city_name dsc, city_id id

Double click on city_id element of form frm_company1, set its UI Component as Combo: (remote) and select lookup_city as lookup. Select lkp_country element as parent and write the following code.

return {_qid:6457, xcountry:ax}

Let's break down the code:

  • qid : id of lookup query lookup_city

  • xcountry : parameter of lookup_city query

  • ax : parent element's value

Now, go to Query Parameters of lookup_city query and click on button. Write following configuration and click save.

Enter some sample data to city table.

Now, when we select Turkey as country the city drop-down list will have Ankara and Istanbul values. Since City element is child element and it changes according to parent element Country.