# Navigation - Overview

## Summary

↳ [#direct-navigation](#direct-navigation "mention")

↳ [#logic-based-navigation](#logic-based-navigation "mention")

↳ [#hooks-navigation](#hooks-navigation "mention")

↳ <mark style="background-color:orange;">add-on</mark> [#forced-navigation](#forced-navigation "mention")

{% hint style="warning" %}
**Attention!**

Please read carefully the instructions below, as the powerful `sf-goto` can be used in a magnitude of cases with various setups.\
We are on track to release many examples and videos to showcase every possible combination.

&#x20;<mark style="background-color:green;">new</mark> <mark style="background-color:orange;">add-on</mark> [Forced Navigation](#forced-navigation): ability to place `sf-goto` outside of form steps!

{% endhint %}

***

## Methods Overview

Superform’s navigation capabilities are versatile, designed to accommodate a wide range of form setups. Explore the distinct features of each method below.

#### **Direct Navigation**

`sf-goto` can be applied to navigation elements, allowing for navigation between form steps, including `next` , `back` , `+1` , `-1` , or specific steps by name (`step-name`) for step teleport. This provides flexible navigation options. You can teleport by +X number or just assigning the step-name as a value.\
\
→ How to: [Direct Navigation](https://deltaclan.gitbook.io/superform/essentials/navigation-overview/direct)

#### **Logic-Based Navigation**

`sf-goto=logic()` navigation combines the `sf-logic` and `sf-logic-goto` attributes, allowing for dynamic branching based on logic conditions. If a logic condition is met, navigation proceeds to the step specified by `sf-logic-goto`. Otherwise, a fallback step can be defined by `sf-logic-fallback`.\
\
→ How to: [Logic / Conditional Navigation](#logic-based-navigation)

#### **Hooks Navigation**

`sf-goto=hook(hookName)` can trigger a specific hook registered in the code by specifying hook name. This provides a way to integrate programmatic navigation actions, allowing for customized navigation flows.\
\
→ How to: [Hooks Navigation](https://deltaclan.gitbook.io/superform/essentials/navigation-overview/hook)

#### Forced Navigation

&#x20;<mark style="background-color:green;">new</mark> <mark style="background-color:orange;">add-on</mark>&#x20;

`sf-force-goto` to enable navigation controls outside form steps. Use the attribute in conjunction with `sf-goto`. This combination allows the external elements to navigate through form steps seamlessly.&#x20;

⚠️ Works in conjuction with your normal `sf-goto`.

⚠️ Note that keyboard navigation is not supported for elements using `sf-force-goto`.

{% hint style="warning" %}
**Step Validation**\
Before navigating to the specified step, `sf-goto` validates the current step to ensure all required inputs are completed.

{% endhint %}

{% hint style="info" %}
**Flexible Navigation**\
The interplay between `sf-goto`, `sf-logic`, and `sf-logic-goto` supports both straightforward and dynamic navigation, ensuring forms can handle everything from simple step transitions to complex branching logic.

{% endhint %}