List Control


Information about the List Control.

List Control Overview : Building Disconnected Applications

The List Control is the fundamental building block for creating mobile applications with offline support. Interfaces for editing data via a Detail View and searching records with sophisticated Search controls are also easily added and configured to work with the List Control. Fetching, editing, and synchronizing data are all handled by the List Control.

Alphabet Buttons Search

Alphabet Button Search adds a series of buttons to the List that filter the List control when clicked.

Cascading Lists - Delay Render

The UX component makes it very easy to create cascading Lists.

Adding Calculated Fields to a List

Calculated fields can be added to a List control using Custom Controls and Computed columns.

Converting Static Data into SQL Data

Static List Control data can be converted to a SQL data source using the "Convert Data Source to SQL Database" tool.

Copying List Layouts

In a List with multiple layouts, the layout for a Columnar layout can be copied to a new layout.

Creating Kanban Layouts in a List Control

Visually organize task or project data using the "Kanban" layout with the List control. Items displayed using a Kanban layout can be reorganized within "categories" or moved between categories using drag-and-drop within the List.

Decoded values

Events to Transform Data Before Display and Save

When you define a List control with a Detail View, two new properties are exposed for each List field.

Dialing a Phone Number Shown in a List

The List control can be used to create a list of phone numbers that when clicked on will dial the selected number. This is done by configuring a hyperlink control inside of the List.

Disconnected Data Entry - Preventing Duplicate Records when Connectivity is Lost

When you are working with disconnected data in a List control there is a small possibility of a synchronization request being submitted to the server more than once - resulting in the possibility of duplicate records in the database.

Displaying Google Maps in List Rows

You can add a static google map to each row in a list that is generated from geographic information in a database.

Embedding Detail Views and Child Lists into a List

When you create a List with a Detail View, you can specify that the Detail View should be embedded directly in the List and that it should be shown/hidden when the user clicks on a row in the List.

List Control Fixed and Virtual Columns

Keep important information in view by freezing columns. Fixed List columns remain on-screen while the user scrolls your list.

Freeform Layout - Hyperlinks

Hyperlinks can be included in the Freeform List layout. However, you need to make sure to handle event propagation otherwise the URL may not behave as expected. This is done using a5-items.

Geography Searches


List Control In-place Editing

Enables editing List records directly within in the list layout.

Introducing the List Builder

The List Builder can be a very powerful control, particularly when used in combination with a Form View control and Editors/Editor Sets.

Lazy Image Loading

If a List control contains a large number of images, it can slow down the initial load of an application. The initial load experience can be improved by delaying image downloads until the image visible using Lazy Image Loading.

Displaying Charts in Lists

Add a chart to your List layout using the List Chart field.

List Column Actions

Add an easy way to filter data to any app with List Column Actions.

List Column Separators

Easily add vertical lines separating columns using List Column Separators.

UX Component - Detail View - New Records - Default Values

When you define a List control with a Detail View you can specify Javascript code to return the default value for a field when a new record is created in the Detail View.

Refresh and Filter Operations - User Defined Ajax Callbacks

The List control has methods that allow you to refresh the data or filter the data.

SQL Data Source - Group By in SQL - Filter List

If a List control is based on a SQL statement that uses the GROUP BY clause and the UX contains a button to filter the list, if a filter is defined on any of the summary fields in the SQL statement, an appropriate HAVING clause will be generated.

Synchronization using Batches

In a disconnected application a user might have been disconnected for quite some time. During this time they may have made a number of edits on their client-side device. When they get their connection back, the user might click a synchronize button in order to push their edits back to the server. However, because they made a large number of edits, it is quite likely that the server might take a while to actually process all of the changes that the user made. While the server is processing information the user/client will be waiting for a response and, if the server takes to long, the client-side device could time out before recieving said response. One way to avoid this problem is to send the user's edits to the server in batches, such that the user can get feedback as to what progress has been made.

Template Items - a5-item Attribute

Template Items are a powerful new way to efficiently add event handlers to the HTML markup used in the List template. Template items are added to the HTML markup by adding an a5-item attribute to the markup, as explained below.

Templates - Date Formatting

Typically the data in a List control is all text data. So even though a column in the List might be displaying a date value, the actual data in the List data array for that column is still a string.

Two-state Static Images

Static images in a List can be configured as two-state images, which display a different image based on the static image's toggled state: on or off.

Using a Icon to Indicate Selected Rows in a Multi-select List Control

Button List controls, and the Checkbox controls rendered as a Button List, can show an icon on selected items. The List control can also be configured to allow multiple selections (like a Button List or Checkbox), but it does not show an icon on the selected rows to indicate the row has been selected (it shows selected rows using a different row color).

Using a Slider Control to Scroll a List

Say you have a List control and you want to put a Slider control under the List to scroll the List. Assume that the name of the Slider control is 'Slider1'.

List Control and Data Series - Using Argument Arrays in SQL Queries

You can use an IN clause with an argument array in the SQL query for a Data Series or List Control.

UX Component 'Dirty State'

Just like standard UX Components controls (such as Textbox, Textarea, RadioButton, etc), the List control is bound to a UX component variable. When the value in any control changes the UX component is considered to be 'dirty'. So for example, if you open a UX and then select a row in a List, ghe UX will go from 'clean' to 'dirty'.

Virtual Javascript Column

A List field whose value is computed using JavaScript.

For components that use a list control along with tens or hundreds of additional controls, pairing a list control with a FormView control is a convenient way to save on run-time memory. Doing this can also eliminate many interface problems caused by certain operating systems. See also the List Properties section of the documentation and the properties pages for the List Builder.