Mobile list view

The information that appears in a mobile list is different than a list on a desktop. Smaller screen real estate limits the information that is easily viewable. You can control mobile list text using the table titles module.

Use Table Titles to control the information that appears in a mobile list. The information that appears in a list item is made up of the following components.
  • Title: Appears prominently at the top of the list item. You can configure the list item title by selecting the fields that appear as the title. For a more advanced configuration, you can use a script to determine how and what displays as the list item title.
  • Display title: Appears as subtext beneath the title for a list item. You can customize the display title by using the configure dictionary option for a field on a form.
  • Extras: Any extra information you want to appear in the list. Extras are only configurable using a script.
Figure 1. Mobile list view
Example mobile list with the title as a short description, display title set to show the Priority, and the extras declaring the need to work on the problem.

Customize the mobile list view

Configure what information displays in the mobile list view.

About this task

When you view a mobile list, the smaller screen can only accommodate some information. Use Fields to determine what information displays in a list on mobile.

Procedure

  1. In the desktop interface, navigate to System Mobile UI > Table Titles.
  2. Click New, or select an existing table to edit.
  3. Fill in the fields, as appropriate.

    Mobile list view with short description, assigned to, and updated included in the slushbucket

    Important:

    Table titles define the title appearance for a list on a mobile device as well as in the split pane view on the desktop interface. You can change the title for any table or add a title record for a different table, however, the change affects both mobile lists and the list card in the split pane view.

    For example, the default title for the Incidents [incidents] table is the short description. If you create a table title record to display the priority field as the incident title, the priority field appears as the table title for incidents on a mobile device as well as in the list card in the split pane view.

    Field Description
    Table Select the table you are defining a title for.
    Note: The list shows only tables and database views that are in the same scope as the title.
    Fields Click the lock icon to display the Fields slushbucket. Select the fields that display by default when someone views this table on a mobile interface.

    Each selected field appears as the table title in a list on a mobile device, as well as in the list card in split pane view on a desktop interface.

    Updated Displays the date and time when the table title was updated.
    Script [Optional] Create a server-side script that generates a string to display under the display value on lists. For example, if you are defining a title for My Approvals, the script could display the different approval items below the title.
  4. Click Submit.

Result

iPhone view with short description, Assigned to, and Updated included in the mobile list view

Script items in a mobile list

For a more advanced option for configuring the information that appears in a mobile list, you can create customized scripts.

Before you begin

Role required: admin

About this task

Use scripts to control the following components in a mobile list.
  • Title: Use the setTitle() method to script a title. The list title is connected to a specific table in the system, for example Problem. Each table contains a list of field options, defined by field_list that you can use to determine the title.
  • Extras: Use the setExtras() method with an array of strings to configure the information that displays after the list title. Scripting extras adds new rows to the list items.

Procedure

  1. Navigate to System Mobile UI > Table Titles.
  2. In the Script field, create a script to define which fields appear in the mobile list.
    For example, the following code block uses setTitle and setExtras to configure a mobile list for the problem table. The title shows the short description for a problem. The extras include additional information for the problem priority.
    var title = current.short_description;
    var extras = [];
    
    if (current.priority === 1){
    	extras.push("Critical!");
    }
    else if(current.priority === 2) {
    		extras.push("High Priority!");
    }
    else {
    	extras.push("Carry on");   
       }
    
    titleValues.setTitle(title);
    titleValues.setExtras(extras);
  3. Click Submit.

Add a mobile display title

Use the display title option to add a subtitle to list items on a mobile device.

Before you begin

Role required: admin

Procedure

  1. Navigate to the table you want to configure the display title for. For example, Problem.
  2. Right-click the field you want to display and click Configure Dictionary. For example, Urgency.
  3. Select the Display check box.
    You can only have one display title for a table. The system automatically clears the selection for any previously selected display titles when you select a new one.

Result

Figure 2. Display title
List item on a mobile device with the display title highlighted