Sub Menus
There are certain situations that make it more challenging to navigate through an application. For example: selecting a parent case, filling out a form for the parent, selecting a child case and filling out a form for that child. Typically a scenario like this requires navigating to each form from the app's home screen and selecting the parent case selection twice.
The navigation can be simplified by using Sub Menus to nest one menu inside of another menu. In the above example, this would allow the child case menu to be nested within the parent menu. This nesting is seen by mobile workers when navigating through the app. In regular workflows, only forms can be found after selecting a menu. When using Sub Menus, an app builder can place other menus under a parent, alongside forms.
Configuration via CommCare HQ
In order to use Sub Menus you must enable the add-on under app settings:
If you don't see the Sub Menu setting under the Add-ons app settings, go to the menu in the top right corner, and select "Mobile Experience":
Once you have your menus configured you can set the parent on the menu settings page:
After creating a parent/sub menu relationship, the sub menu(s) will appear nested under the parent menu in the form tree:
Here, the Children menu is a sub menu to Mother Registration and appears indented and connected to its parent menu with a thin line. Sub menus will always appear beneath their parent, even if they were originally positioned elsewhere in the form tree's hierarchy. If a parent menu has a number of sub menus, they will all appear nested under the parent. However, sub menus can be rearranged as needed.
Deleting Parent Menus
If you need to delete a parent menu, you must first decouple its sub menus. You can do so by navigating to the sub menu's settings page and choosing 'No Parent' in the Parent Menu field, or by simply deleting the sub menu first.
Sub Menus and the Menu Mode Add-On
Sub Menus can be combined with the Menu Mode add on to further customize your apps workflow. When enabled, Menu Mode allows you to choose between two workflows: first, if 'Display menu and then forms' is selected, the mobile worker must first choose the menu and then the form(s) under it. If 'Display only forms' is selected, the icon for the sub menu with this setting defined is not displayed, and its forms are displayed in its place. The latter workflow would allow mobile workers to directly select forms from the sub menu, provided the case type is the same between parent menu and sub menu.
More about Add-Ons can be found here.
Parent Child Selection
If your sub menu contains a form that updates cases and you want the child case list to only show child cases of the selected case in the parent menu's case list then you must configure the child menu as such on the Case List page:
Supported Uses
Parent child case selection and forms
This is the common use case where the user has configured two menus: M1 (case type = mother) and M2 (case type = baby). M2 is configured with parent selection (making the ‘baby’ case type a child of the ‘mother’ case type).
The user now selects M1 as the parent menu of M2.
Result
Only M1 is shown in the app’s home screen. After selecting M1 and selecting a ‘mother’ case the user is presented with the M1 forms and also the menu item for M2. Selecting M2 will prompt the user to select a ‘baby' case that is a child of the previously selected 'mother' case. Then M2 forms will be displayed.
Unsupported Use cases
A sub menu has a different case type from its parent and the case types are not related i.e. not parent / child cases
Multiple levels of nesting
Form in parent menu does not update case
Registration from child menu's case list isn't supported
Drag & drop functionality to create a parent/child relationship
End of form navigation from one child form to another child form within the same menu. A workaround would be to create a separate child case type case list with the other child form, and have the end of form navigation point to the form within this new child case list.