Navigate Action

The action module for this action is "vb/action/builtin/navigateAction".

This action will navigate the user to a page and also pass any parameters to activate that page. Parameters for this action are:

Parameter Name	Description
page	The path to the destination page. The path can be a single page ID, or a path starting with a page ID. It can be an absolute path starting at the application or relative to the current page. When used with 'flow' , the path cannot be absolute; it navigates to the page relative to the flow.
flow	ID of the destination flow, used to change the content of the flow displayed in the current page. When used with 'page', navigates to the page in that flow.
target	Target of the destination flow, used with 'flow' to change the content of the parent flow instead of the nested flow. Values are 'parent' or 'self' (default).
params	A key/value pair map that will be used to pass parameters to a page (optional)
history	Defines the effect on the browser history. Values are 'replace', 'skip' or 'push'. If the value is 'replace', the current browser history entry is replaced, meaning that the back button will not go back to it. If the value is 'skip', the URL is not modified. (optional and default is 'push')

Page input parameters are page variables with the Input Parameter enabled. You can use the Navigate action to set the value for these input parameters. But if a page parameter was a path to a deeply nested page, like /shell/main/other, you'll see a list of all input parameters from each page/flow in the path (that is, input parameters for the shell page, the main flow, as well as other pages). Name collisions across flows/pages are not accounted for—something you'll need to keep in mind when defining input parameters.

Here's an example of the navigate action:

"myActionChain": {
  "root": "navigate",
  "actions": {    
    "navigate": {
      "module": "vb/action/builtin/navigateAction",
      "parameters": {
        "page": "myOtherPage",
          "params": {
            "id": "{{ $page.variables.myId }}"
         }
       }
     }
   }
 }

This returns the outcome 'success' if there was no error during navigation. If navigation completed successfully, returns the action result true, otherwise false. Returns the outcome fail with the error in the payload if there was an error.

Navigating to the same page

Navigating to the same page with different input params is considered as a valid navigation. Since the current page is not changing, only the page input variable value will change and the onValueChanged event will be triggered. When navigating to the same page, the events vbBeforeEnter, vbEnter, vbBeforeExit, and vbExit are not triggered because the page never transitioned to an enter or exit state.

The navigation is pushed into the browser history, so pressing the browser's Back button will restore the previous values of the input variables.

Example 1-36 Page or flow descriptor with navigation fromExternal property set to enabled

"navigation": {
  "fromExternal": "enabled"
}

Navigation with the page parameter

The 'page' parameter is the ID of a sibling page or a path starting with a sibling page's ID (like pageId/flowId/...). It cannot be or start with a flow ID.

Example 1-37 Navigate to a sibling of the current page

To navigate to page other, a sibling of the current page:

"parameters": {
  "page": "other"
}

Example 1-38 Navigate to a sibling page and change content of the nested flow

To navigate to flow main, which is defined under the sibling page other:

"parameters": {
  "page": "other/main"
}

Example 1-39 Navigate to the root application

To navigate to the root of the application:

"parameters": {
  "page": "/"
}

Example 1-40 Navigate to the current flow's default page

To navigate to the current flow's default page:

"parameters": {
  "page": ""
}

Example 1-41 Navigate to a deeply nested page relative to the application root

To navigate to a deeply nested page relative to the root of the application:

"parameters": {
  "page": "/shell/main/other"
}

Navigation with the flow parameter

The 'flow' parameter can only be the ID of a flow defined below the current page or an empty string.

Example 1-42 Navigate to a specific flow

To change the content of the flow displayed in the current page to the flow main:

"parameters": {
  "flow": "main"
}

Example 1-43 Navigate to a page in a specific flow

To change the content of the flow displayed in the current page to the flow main and navigate to the page other or the flow main:

"parameters": {
  "flow": "main",
  "page": "other"
}

Example 1-44 Navigate to the current page's default flow

To navigate to the current page's default flow:

"parameters": {
  "flow": ""
}

Example 1-45 Navigate the parent flow to a specific flow

To change the parent flow to the flow main:

"parameters": {
  "target": "parent",
  "flow": "main"
}

Example 1-46 Navigate the parent flow to the default flow

To change the parent flow to the default flow:

"parameters": {
  "target": "parent",
  "flow": ""
}

Example 1-47 Navigate to any page in a sibling flow

To change the parent flow to the flow main and navigate to page other in the flow main (note that page can be a path):

"parameters": {
  "target": "parent",
  "flow": "main",
  "page": "other"
}