How to create a mobile view for a Table

[stefan14]

Hi,

I read some articles in the servicenow documentation and in the community how to create a mobile view for a table, but unfortunately without success so far.

How do you create a mobile view?

Configure the mobile form layout

Lists and Forms in the iOS and Android mobile application

What I tryed:

- Create a new Table

- Configure -> Form Layout -> new View named 'mobileView' -> customization

- System UI -> View Rules -> new Rule -> connected table, device: mobile

result:

no result, the old view is still there

Maybe someone can give me a hint, what I've done wrong.

[VigneshMC]

View name should be just "mobile"

Thanks

[Rajesh Mushke · Accepted solution]

Hi Stefan,

i hope this will helpful to you.

Mobile means more than just being on-the-go — it's the ability to get more work done while moving freely about the office. The mobile user interface and the tablet user interface offer different views. It's very important to understand the capabilities as well as the limitations you will see while using ServiceNow out of the default view and on your mobile devices (both smartphone and tablet).

First, let's start with what the default view actually is. This is the view that is given to all forms and lists if no other view is specified. For example, you might have an incident form with a default view that has 10 or more different fields that are editable, but this isn't very aesthetically pleasing for mobile users. Creating a mobile view can allow you to select the fields that are most important to you and your organization, making forms more user friendly.

The mobile view is the default view for forms and list layouts on all mobile and tablet devices. Mobile views need to be set up for all tables or the default view will show on your mobile devices but keep in mind there are unsupported features in the mobile view. Creating a mobile view allows you to do away with unexpected behavior for mobile users by removing the unsupported features you have in your default views. A good example of this is certain variable types are not compatible with the mobile view. Removing the fields that have these unsupported variables is a good practice for ensuring users don't come across any errors.

Important things to remember about the Desktop View vs. Mobile View:

• Other views for forms are not available (the only exception is when you don't set up your mobile view so the default view is used).
• Additional custom views cannot be created.
• Some features are unsupported (HTML fields, chat, VTB, and embedded lists, etc.).

These UI limitations are built into the mobile UI to limit the amount of information loaded due to the lack of screen real estate. The mobile view allows you to only see the first section on a form. You do have the ability to add additional sections to your form, though it should be noted that this could cause some errors or the inability to save if you do so. This is because you won't be able to see the additional sections. If you have a mandatory field, you won't be able to edit it and save. This can also happen if you're using a default view and there's a mandatory field on a section other than the main one.

If you don't want to run into any of these pesky problems, it's extremely important to set up views for all of the tables you commonly access on your mobile devices.

The UI limitations are also due to limited hardware on mobile devices, as well as making sure we have a set of features that will function on multiple mobile platforms.

The tablet user interface shadows the same rules as mobile. The mobile view is used if it's been set up and the default view is used otherwise. The big difference between the mobile and tablet views is that the tablet shows more form sections! Don't get too excited here because the mobile view and tablet view are the same thing. Make sure you still aren't putting any of those mandatory fields in these additional sections because your mobile users will get an error and won't be able to save.

Please Refer:

Understanding Mobile and Tablet Views

Mobile View Basics

Let me know if you need more help.

Thanks,

Rajashekhar Mushke

Community Leader - 18

[stefan14]

Thanks for the Informations, this where very helpfull for my problem.

What is also noticeable, is that my mobile view does not get shown directly, when I select my table,

but one site further, so:

table selection -> some table meta data? -> then the mobileview I created.

How can I get the mobile view directly when I select the table?

[Rajesh Mushke]

Hi Stefan,

you are on list view for mobile view.

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.

Mobile list view

Customize the mobile list title

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.

Procedure

1. In the desktop interface, navigate to System Mobile UI > Table Titles.
2. Click New, or select an existing table to edit.
3. If you are creating a new list, select the table from the list.
   The list shows only tables and database views that are in the same scope as the title.
4. Use the Fields slushbucket to add items that appear in the list item.
   The order of the items in the selected column determines the order they appear in on a mobile device.

   

   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 change the table title to display the priority field instead, 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.

5. Click Submit.

Result

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_listthat 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

Display title

Please Refer:

Mobile list view

Configure the mobile form layout

Configure mobile field status indicators

Configure mobile list items navigation

Let me know if you need more help.

Thanks,

Rajashekhar Mushke

Community Leader - 18