Actions
go-to

6min
This action redirects you to another . The go-to action can be used with elements like swipeable and rightElement or combined with another action. When paired with another action, it is triggered after the main action to navigate to a specified screen, for example, saving a date in a form and then opening a list of customers. go-to helps configure navigation, ensuring a seamless app flow. See Navigation﻿ for more information.
﻿Configuration option﻿
A go-to action can be set up in various ways:
As a separate action or in the action list.
As an associated action in the action list.
As a swipeable action in the left or right direction.
As rightElement in the list.
Use the go-to to open a  as a modal using the isModal property set to true. Set to false opens navigates to the specified . 
Use the behaviour property to determine if you want to push the  into the history of navigation, by using the new value, or reuse the one you already have in history by using the existing value.
Considerations
Current known limitations when using the isModal property include:
Unable to send a value from the  modal to the parent .
Depending on the device used different behavior can be expected, such as the  will slide from the bottom to top, but the entire screen will be covered. This applies to:
On any Android device (phones and tablets).
On an iPad in landscape mode:
When the drawer is open, it will only open in the  panel.
When the drawer is closed, it will cover the entire screen, but it will not display as a modal. 
﻿Examples and code snippets ﻿
go-to action
﻿
The simplest example of using a go-to action is to use it as a separate action. When configured, a button will appear at the bottom, redirecting us to the details page when pressed. 
Examples:
See the full example using static data in GitHub. 
See the full example using dynamic data in GitHub. 
go-to
actions:
  - children:
      - type: action.go-to
        options:
          title: Go to
          linkTo: default-employee-detail
actions:
  - children:
      - type: action.go-to
        options:
          title: Go to
          linkTo: default-employee-detail
﻿
go-to with swipeable
﻿
This example uses the go-to action as a swipeable property. We can choose the swipe direction left or right. After pressing the button, it will redirect to the details of the person.
Examples left:
See the full example using static data in GitHub. 
See the full example using dynamic data in GitHub. 
Examples right:
See the full example using static data in GitHub. 
See the full example using dynamic data in GitHub.
left
right
item:
  type: component.list-item
  options:
    title: =@ctx.current.item.lastname
    subtitle: =@ctx.current.item.firstname
    leftElement: 
      element: avatar
      text: " "
      uri: =@ctx.current.item.img
    swipeable:
      right:
        - label: Go to
          color: primary
          onPress:
            type: action.go-to
            options:
              linkTo: default-employee-detail
item:
  type: component.list-item
  options:
    title: =@ctx.current.item.lastname
    subtitle: =@ctx.current.item.firstname
    leftElement: 
      element: avatar
      text: " "
      uri: =@ctx.current.item.img
    swipeable:
      right:
        - label: Go to
          color: primary
          onPress:
            type: action.go-to
            options:
              linkTo: default-employee-detail
﻿
go-to button
﻿
In this example, we use the go-to action as the rightElement in the list-item component. There is a button for each item.
Examples:
See the full example using static data in GitHub. 
See the full example using dynamic data in GitHub. 
go-to-rightElement.jigx
item:
  type: component.list-item
  options:
    title: =@ctx.current.item.lastname
    subtitle: =@ctx.current.item.firstname
    leftElement: 
      element: avatar
      text: " "
      uri: =@ctx.current.item.img
    rightElement: 
      element: button
      title: Go to
      onPress:
        type: action.go-to
        options:
          linkTo: default-employee-detail
item:
  type: component.list-item
  options:
    title: =@ctx.current.item.lastname
    subtitle: =@ctx.current.item.firstname
    leftElement: 
      element: avatar
      text: " "
      uri: =@ctx.current.item.img
    rightElement: 
      element: button
      title: Go to
      onPress:
        type: action.go-to
        options:
          linkTo: default-employee-detail
﻿
Go to onSuccess
﻿
In this example, the go-back action is associated with the submit-form action. After we enter the signature and press the "Sign" button, the submit-form action is performed and then the go-to action redirects us to the next page.
Examples
See the full example using dynamic data in GitHub. 
go-to-onSuccess.jigx
actions:
  - children:
      - type: action.action-list
        options:
          title: Sign and go to detail
          isSequential: true
          actions:
            - type: action.execute-entity
              options:
                provider: DATA_PROVIDER_DYNAMIC
                entity: default/form
                method: create
                data:
                  signature: =@ctx.components.signature.state.value
                onSuccess:
                  title: Succesfully signed
                  actions:
                    - type: action.go-to
                      options:
                        title: Go to employee detail
                        linkTo: default-employee-detail   
            - type: action.go-back
actions:
  - children:
      - type: action.action-list
        options:
          title: Sign and go to detail
          isSequential: true
          actions:
            - type: action.execute-entity
              options:
                provider: DATA_PROVIDER_DYNAMIC
                entity: default/form
                method: create
                data:
                  signature: =@ctx.components.signature.state.value
                onSuccess:
                  title: Succesfully signed
                  actions:
                    - type: action.go-to
                      options:
                        title: Go to employee detail
                        linkTo: default-employee-detail   
            - type: action.go-back
﻿
In this example, we use the go-to action as the rightElement in the list-item component. There is a button for each item. When tapped the go-to will open the  as a modal when the isModal property is set to true. 
Examples
See the full example using dynamic data in GitHub. 
Open jig in a modal
﻿
go-to-ismodal.jigx
default-employee-detail.jigx
employees-dynamic.jigx
quartal.jigx
title: Go To action
type: jig.list

data: =@ctx.datasources.employees-dynamic
item:
  type: component.list-item
  options:
    title: =@ctx.current.item.lastname
    subtitle: =@ctx.current.item.firstname
    leftElement: 
      element: avatar
      text: " "
      uri: =@ctx.current.item.photo
    rightElement: 
      element: button
      title: Go to
      onPress:
        type: action.go-to
        options:
          # When navigating to the jig, the jig opens as a modal, 
          # specifying false will open as a normal jig.        
          isModal: true
          linkTo: default-employee-detail
title: Go To action
type: jig.list

data: =@ctx.datasources.employees-dynamic
item:
  type: component.list-item
  options:
    title: =@ctx.current.item.lastname
    subtitle: =@ctx.current.item.firstname
    leftElement: 
      element: avatar
      text: " "
      uri: =@ctx.current.item.photo
    rightElement: 
      element: button
      title: Go to
      onPress:
        type: action.go-to
        options:
          # When navigating to the jig, the jig opens as a modal, 
          # specifying false will open as a normal jig.        
          isModal: true
          linkTo: default-employee-detail
﻿
In this example, three s are configured to create a stack of data for each guest, including their Name, Age, and Address. Each 's go-to action is set with the behaviour property as new, enabling new guest details to be pushed into the app history. In the final , a secondary go-to action is added. This action introduces a button to review each guest's data by setting the behaviour property to existing and linking to the first  in the stack via the linkTo property. The review process will cycle through each guest's details in the stack before completing.
Go-to new guest
﻿
Review guests
﻿
jig-a.jigx
jig-b.jigx
jig-c.jigx
title: Address
type: jig.default

# Use inputs from the first jig in the stack. 
inputs:
  fullName: 
    type: string
    required: true

header:
  type: component.jig-header
  options:
    height: medium
    children:
      type: component.image
      options:
        source:
          uri: https://images.unsplash.com/photo-1563013544-824ae1b704d3?w=800&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MTB8fG9ubGluZSUyMGNhcnR8ZW58MHx8MHx8fDA%3D

children:
  - type: component.form
    instanceId: form-a
    options:
      isDiscardChangesAlertEnabled: false
      children:
        - type: component.text-field
          instanceId: address
          options:
            isMultiline: true
            label: Address
            
actions:
  - children:
  
      - type: action.go-to
        options:
          inputs:
            fullName: =@ctx.jig.inputs.fullName
          # In this go-to action we go back to start capturing the next stack
          # in the data set.           
          title: Add another guest
          # Select new to push the jig into the app history,
          # this allows you to capture the next set of data for a new stack.           
          behaviour: new
          # Open the first jig in the stack to start capturing the new stack of data.           
          linkTo: jig-a
     # Add a second go-to action that will create a secondary button, 
     # allowing you to review the existing data set in the stack.
     # Add existing to behaviour which will cycle through all the jigs in the history,
     # showing the jig with the data for each jig. 
     # Note the jigs will cycle through the screens for each capture, 
     # meaning if you captured 3 sets in the stack, all 3 stacks are shown.  
      - type: action.go-to
        options:
          title: Review details
          # Select existing to return and display the jig data
          # that is held in the app history.          
          behaviour: existing
          # Open the first jig in the stack to start cycling through the data
          # for each stack captured.        
          linkTo: jig-a 
title: Address
type: jig.default

# Use inputs from the first jig in the stack. 
inputs:
  fullName: 
    type: string
    required: true

header:
  type: component.jig-header
  options:
    height: medium
    children:
      type: component.image
      options:
        source:
          uri: https://images.unsplash.com/photo-1563013544-824ae1b704d3?w=800&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MTB8fG9ubGluZSUyMGNhcnR8ZW58MHx8MHx8fDA%3D

children:
  - type: component.form
    instanceId: form-a
    options:
      isDiscardChangesAlertEnabled: false
      children:
        - type: component.text-field
          instanceId: address
          options:
            isMultiline: true
            label: Address
            
actions:
  - children:
  
      - type: action.go-to
        options:
          inputs:
            fullName: =@ctx.jig.inputs.fullName
          # In this go-to action we go back to start capturing the next stack
          # in the data set.           
          title: Add another guest
          # Select new to push the jig into the app history,
          # this allows you to capture the next set of data for a new stack.           
          behaviour: new
          # Open the first jig in the stack to start capturing the new stack of data.           
          linkTo: jig-a
     # Add a second go-to action that will create a secondary button, 
     # allowing you to review the existing data set in the stack.
     # Add existing to behaviour which will cycle through all the jigs in the history,
     # showing the jig with the data for each jig. 
     # Note the jigs will cycle through the screens for each capture, 
     # meaning if you captured 3 sets in the stack, all 3 stacks are shown.  
      - type: action.go-to
        options:
          title: Review details
          # Select existing to return and display the jig data
          # that is held in the app history.          
          behaviour: existing
          # Open the first jig in the stack to start cycling through the data
          # for each stack captured.        
          linkTo: jig-a 
﻿
﻿
﻿