It is common to find dynamic controls such as Combo Boxes or Wheels in web applications and native mobile applications. These controls restrict user data input dynamically and allow defining the data source in an easy and reusable way.
GeneXus simplifies this by making it possible to configure the data source (either Attributes or Data Providers) at the design stage for controls such as Dynamic Combo Box, Dynamic List Box, Wheel Control for Native Mobile apps or Edit.
This article explains how to apply dynamic controls using the Data Source From property. To learn how to use it when it is configured as "Data Provider" and the Control Type property is "Edit", see Edit with Suggest.
Consider an application called LightCRM, which enables end end users to schedule Meetings with a certain Contact of a Company. To schedule a new meeting, among other things, the Company name must be indicated as well as the Contact with whom the meeting will be held. Suppose you want to display, on the web or native mobile application, a Dynamic Combo Box with the Company’s Contacts which should be ordered by birth date.
To solve this requirement, you need to use the Data Provider object as the data source for the controls to be used. Then, follow the steps below:
First, create a Structured Data Type (SDT) object and name it “ContactsSDT”.
Indicate the SDT is a collection by selecting the Is Collection checkbox, and define the ContactId and ContactName members as follows:
Create a Data Provider object and name it "GetContactsByBirthday". Drag the ContactsSDT object from the KB Explorer to the Source tab of this Data Provider and edit the Source as shown below:
Add the following rule to the Rules section of the Data Provider:
This feature can be used both for web applications and native mobile applications.
Go to the Web Layout of the Meeting Transaction object.
- Set the following for the CompanyId attribute:
- Set the following for the ContactID attribute:
The following image shows the detailed configuration of the properties:
Next, run the Web Panel object called "Home", select the Work With Meetings object, and click on the Insert button to create a new Meeting.
The image below shows the result of the configurations.
Open the "WorkWithMeeting" object and go to Section(General). In the Layout, click on the ContactID attribute and set the same properties that were previously set for the web version, as shown in the following image:
Note: If "WorkWithMeeting" is configured with another Layout of Edit type, the same changes have to be made if you want to show the same features in all platforms.
Finally, run the "LightCRM" Menu object and add a new Meeting record.
- When the Data Source From property is set to Data Provider:
- For native mobile applications, the Wheel control can be used with the same settings as for the Dynamic Combo Box control.
Data Source From property
Dynamic Combo Box and Dynamic List Box Properties in Web Forms
HowTo: Use the Dynamic Combo Box Control for Native Mobile Applications
Wheel Control for Native Mobile apps
Edit with Suggest