In this article, we show you how to access the mobile JSON editor in TimeTonic and where to find the column identifiers (IDs) needed to configure your custom mobile display.

The goal is to guide you step-by-step before writing your first JSON code snippets in the integrated editor.

With it, you will be able to customize and configure automatic download, shortcuts, a card view mode, and much more.

Steps to Use Mobile JSON Code Snippets

1. Access a table in your workspace

   The screenshot below shows an example of a table view displaying a dataset that we will use to demonstrate the configuration and illustrate the mobile JSON setup on the TimeTonic Android mobile application.

2. Access the table or view configuration menu

   From a table in your workspace, click the three dots ⋮ at the top right.
   This opens the tables and views options menu, which includes:

   In the table options, click → Organize columns to display the column IDs.

3. Identify the column IDs

   These identifiers (field IDs) are essential: they allow you to link mobile interface elements to table fields in your JSON code snippets.

Once this information is available, you can start writing and testing your JSON settings in the mobile editor to customize the rendering of your forms, views, or sections within the TimeTonic mobile app.

4. Access the list of mobile JSON code snippets to choose from based on your configuration needs.

5. Write the mobile JSON configuration

   In the view options, click → Edit mobile configuration

   

   → this opens the JSON editor

   

6. Schema, table view, and mobile preview of a JSON configuration

• The table view 

Diagram illustrating the configuration points defined in the mobile JSON editor for the snippet cardView, accompanied by a screenshot of the mobile app showing the configuration preview.

The mobile configuration applies to a single view 

• The mobile view and the JSON editor 

7. Copy a JSON block and paste it into your editor, then replace the values with your field IDs.

8. Save: reload the view on your mobile device to see the result.

9. Adjust the values (booleans or IDs) until you achieve exactly the desired behavior.

Example to copy into the editor:

{
  "autoDownload": true,
  "cardView": {
    "title": 101,
    "value1": 102,
    "image": 106
  }
}

Example to copy into the editor:

{
  "autoDownload": true,
  "expandAllGroups": false,
  "createOnly": true,
  "shortcut": true,
  "disableLinkAccess": [301, 302],
  "cardView": {
    "showFieldsTitles": true,
    "title": 12345,
    "value1": 23456,
    "value2": 34567,
    "value3": 45678,
    "value4": 56789,
    "image": 67890
  }
}