Dropdown

It is an object that presents the values from a data source or the values that the developer has added as an element to the user in the form of a drop-down list in the web interface and serves to select elements from this data.

While the active screen is a form in the authoring interface, the Toolbox panel lists form objects. The object is added to the form by drag/drop from the toolbox panel.

Clicking on the object displays the "General" and "Events" tabs in the Property Viewer panel, and the properties of the object can be viewed and edited. The inheritance scheme by which the properties of the object are transferred is as follows;

General

Design

'Name' - The name of the object to be used by the system. Inside another object and on the code side, the object is accessed by the value written in the namespace.

Caption

'Title' - The part where the label text of the object is edited.

'Position' - The part of the object label that regulates whether it is positioned on the left, right or above the object.

>Choices Available : Left, Right, Top, Bottom

'Width' - This is where the width of the label field is set.

'Height' - This is the part where the height of the label field is set.

'Font' - The part of the text in the label area where the font, font, font size and color are set.

'Ellipsis' - The portion where the label text is set to appear for the part of the text that does not fit, whether the ellipsis (...) appears.

'Visible' - The part where the label field is set to be hidden or visible.

'Show Colon' - Colon next to label text (:) is the part where the expression is set to appear or not.

'Horizontal Align' - Label text; This is the portion where right-just, left-just, or center-justify settings are performed.

>Choices Can Be Made: Left, Center, Right

'Vertical Align' - Label text; This is the portion where the Justify, Snap Down, or Center settings are performed.

>Choices Available : Top, Middle, Bottom

'Mark Char' - To make the object stand out, enter *, ! is the area where characters such as can be entered.

'Mark Position' - The part where the character designated as the mark character is set to be shown at the beginning or end of the label text.

>Choices Can Be Made: AtFirst, AtLast

Datasource

'Type' - The choice of what type of data to add to the object is made from this field. The Type field lists two options, "Dynamic" and "Static". Depending on the type selected, the properties that appear in the data source section will vary.

<div style={{textAlign: 'center'}}>

</div>

When "Dynamic" is selected as an option; This means that data in the object will be loaded dynamically from a data source. When the Dynamic option is selected, the Datasource and Run at Server properties will be visible in the Datasource field.

<div style={{textAlign: 'center'}}>

</div>

Selecting "Static" as an option means that a manual element will be added to the object, and the Items** property will be visible in the data source field.

<div style={{textAlign: 'center'}}>

</div>

NOTE :::note

Starting in this section, selecting dynamic in the type field on the object will describe object usage. You can open the relevant section to view the properties in static use.

:::

<details> <summary>Click here to view dynamic usage details!</summary> <div>

'DataSource' - The field in the object that will be used to be able to list values from a data source. The data source definition that is added to the DataSource section of the project in Solution Explorer and that compiles successfully becomes selectable from the DataSource portion of the object.

'RunAtServer' - This option determines whether the query connecting to the object is run from the server or the client.

If this option is enabled, when clicking on the form in the web interface, the query is run on the server side before the form is opened, and when the form is opened, the query result is loaded into the object. When the option is made inactive, when the form is clicked in the web interface, the object starts to load the result values of the query after the form is opened.

The wait time for the query result to load takes effect at the time the form is opened with this feature active, and at the time the data is loaded into the object after the form is opened quickly when the feature is passive.

'Value Expression' - This field is visible when a data source definition is selected from the Data Source section. All columns returned from the selected data source are listed in this field. When the user makes a selection from the interface, it is determined in this field which column value the registration field of the selection will be.

For example, a query that returns a list of users is bound to the object. Let the ID (Username), FIRSTNAME (Name), EMAIL (Mail Address) columns return from the query. Because the purpose of this object is user choice, the ID column returned from the query must be selected in the Value Expression section because the unique record value of the selected user is contained in the ID column.

'Display Expression' - This field is visible when a data source definition is selected from the Data Source section. All columns returned from the selected data source are listed in this field. When the user selects from the interface, this field determines which query column the expression that will appear in the object will come from.

For example, a query that returns a list of users is bound to the object. Let the ID (Username), FIRSTNAME (First Name), LASTNAME (Last Name), EMAIL (Mail Address) columns return from the query. Since the purpose of this object is user choice, the values returned from the FIRSTNAME and LASTNAME columns of the selected user will be desired to be displayed in the object. Therefore, these column values are selected in the Visible Expression section.

The column or columns selected from the 'Display Format' - Appearance Expression field are automatically added to this field as well. The area used to specify the appearance format for element text to list in the object. In order for the elements to be displayed in a desired format, the corresponding format structure can be specified in this field. And after object selection, the value to be displayed in the object can be made to appear in the web interface to the end users in the specified format.

The types of formats that can be used in formatting can be accessed from the link (https://shopify.github.io/liquid/) in the information message that appears when the field is focused and the desired format structure can be applied to the relevant column in the View Format field.

NOTE :::note

See Display Format Examples for Display Format sample applications.

:::

</div> </details>

note

Starting in this section, selecting static in the type field on the object will describe the use of the object. Dynamic You can open the relevant section to view the features in use.

<details> <summary>Click to view static usage details!</summary> <div>

'Items' - When the object wants to list elements that were added manually at the time of development, not records from a data source, the element identification is done from this field. It is the part where the list elements are determined. From this area, a new element can be added to the object, an existing element can be deleted, or it can be edited.

Clicking in the Elements field opens the add elements window. By clicking the Add button, new element items are created for the object.

The Value and Title fields of the entered element are populated. If the element is desired to have an icon, it can be selected from the icon library within the Icons area. If the Selected field of the element is active, this element will be automatically displayed as selected in the object in the web interface. By pressing the "Save" button, the process of adding elements to the object is completed.

When you want to edit an element added to this field, you can click on the relevant element record and edit it from the element details window opened on the side. When you want to delete an existing element, the delete button in the element details is used.

When the object is clicked in the web interface, the element records specified in the Elements area are listed for the user to select.

</div> </details>

Appearance

'Visible' - This is the part where the object is hidden and made visible. When this field is active, the object is visible on the form. When the field is made passive, the object becomes invisible.

'Client Visible' - When the object is not visible when the form is first opened, when it is desired to make the object visible, to make the object visible when a certain condition is met, this field is made passive so that the object is invisible on the client side. When the condition set by the code or the Rules Manager is met, the object can be made visible again. When server visibility is inactive, the client cannot intervene, but the server can intervene when client visibility is inactive.

'Enabled' - The active mode of the object is set from this field. When this feature is active, data entry can be provided to the object and the object can be edited. When the feature is passive, the object is in non-editable mode and appears passive.

'Client Enabled' - When the form is first opened, the object is not active, when a certain condition is met, etc., this field is made inactive so that the object is not active on the client side. Once the condition set by the code or the Rules Manager is met, the object can be activated again. When server activity is inactive, the client cannot intervene, but the server can intervene when client activity is inactive.

'Background Color' - The area used to give the object a background color.

'Title' - Hovering over the object with the cursor while the form is open in the interface, the text typed in this field is shown as a hint. It is a feature used to direct the end user when detailed information about the object is desired.

'ClassName' - The field in which the object visibility can be changed by defining a class written in the CSS file of the form.

'Placeholder' - A property used to display the data information requested to be entered by the end user into the object for informational purposes within the object. When the end user views the object, they see the referring text typed in this field, and the router text disappears when they focus on the object and begin entering values.

'Size Type' - This is where the object selection area size is set.

>Choices Can Be Made : Small, Middle, Large

Behavior

'ReadOnly' - This is where the object is set to be in edit mode. When this feature is enabled, the object does not allow data entry, it is in read-only mode. The property must be passive for data entry to be allowed into the object.

'Tab Index' - By entering numeric values in this field, it is determined in which order the tab button is pressed to focus between the form objects. When filling out the form, instead of clicking the cursor on the object where the data is to be entered, the tab button is pressed to focus directly on the indexed objects in a certain order. This is a feature that increases the speed of filling out forms.

'Required' - The field in which it is determined whether data entry is required on the object. When this feature is activated, it is not possible to advance/save the form without entering data into the object.

'Value Type' - The field in which the type of object elements is specified. Based on the type specified here, the Value field type of the row inserted in the Elements field is changed. Also, when a parametric query is bound to the object, the parameter type must match the type value selected in the Value Type field.

'Display Mode' - This is where the elements within the object are set to display when selected. The species that can be selected in the field are:

- Text: In the selected element in the object, only the text of the item is shown.
- Icon: In the selected element in the object, only the icon of the element is shown.
- IconText: The selected element in the object is shown together with the text and icon of the element.

CAUTION

If Type : Static is selected in the Datasource field of the object and the element is attached, the Value Type field becomes non-selectable.

Data Definition Language

'Field Name' - The field in the database of the system that determines the name of the column it will create for the object. In the "Name" section, the object can be given another name and the column name to be created for the object in the database table can be created as a different name.

'Allow Null' - This section indicates whether the database field to be created for the object will allow null values.

Events

The events owned by the object are located in the "Events" tab in the Property Viewer panel. Each event is triggered at different runtime moments, performing its own unique operations. Code written by the developer to these events is also executed at the time the corresponding event is triggered.

When the events in the "Client" field are double-clicked, the screen is directed to the form code editor section called "Formedi.ts" where TypeScript coding can be done and the method block for the clicked event is automatically created.

When the events in the "Server" field are double-clicked, the screen is directed to the form code editor section called "Formadı.cs" where C# coding can be done and the method block for the clicked event is automatically created.

The developer can construct any code block within these methods. Next to the event whose method is created on the code side by clicking from the Events tab, the method name information is automatically generated and the relationship between the event and the method is specified.

Formed methods;