Tutorial: Navigation

Navigation can be done by the use of a multiple of formsApi methods.

Go to next step, will trigger validation.

formsApi.goToNextStep()

Go to next step, does not trigger validation.

formsApi.goToNextStep({skipValidation: true})

Go to previous step.

formsApi.goToPrevStep()

On step navigation there is a possibility to register these events and take action. You could for example trigger a google tag event (perhaps setting a hidden field to some value to prevent faulty data if the user moves to and from a page multiple times).

onStepChange, onNextStep and onPrevStep all has from and to available. These have key value pairs {index: 0, name: 'Step #1'}.

formsApi.onStepChange((from,to) => {
    if( from.index === 0){
        console.log('Navigated from the first step.')
    }
})

formsApi.onNextStep((from,to) => {
    console.log(from, to)
    if( from.index === 0){
        console.log('Navigated from the first step.')
    }
})

formsApi.onPrevStep((from,to) => {
    console.log(from, to)
    if( from.index === 1){
        console.log('Navigated from the second step to the first step.')
    }
})