> For the complete documentation index, see [llms.txt](https://docs.devolutions.net/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.devolutions.net/powershell-universal/da/apps/components/navigation/stepper.md).

# Stepper

Byg guider med flere trin i PowerShell Universal-apps med Stepper-komponenten, herunder trinvalidering, overspringning og lodret retning.

**Steppere formidler fremdrift gennem nummererede trin. Den giver et arbejdsflow i stil med en guide.**

Steppere viser fremdrift gennem en sekvens af logiske og nummererede trin. Steppere kan også bruges til navigation. Steppere kan vise en kortvarig feedbackmeddelelse, efter at et trin er gemt. Stepperen understøtter lagring af inputdata i stepperkonteksten. Den understøtter følgende kontrolelementer.

* [Autofuldførelse](/powershell-universal/da/apps/components/inputs/automcomplete.md)
* [Afkrydsningsfelt](/powershell-universal/da/apps/components/inputs/checkbox.md)
* [Datovælger](/powershell-universal/da/apps/components/inputs/date-picker.md)
* [Radioknap](/powershell-universal/da/apps/components/inputs/radio.md)
* [Select](/powershell-universal/da/apps/components/inputs/select.md)
* [Skyder](/powershell-universal/da/apps/components/inputs/slider.md)
* [Til/fra-kontakt](/powershell-universal/da/apps/components/inputs/switch.md)
* [Tekstfelt](/powershell-universal/da/apps/components/inputs/textbox.md)
* [Tidsvælger](/powershell-universal/da/apps/components/inputs/time-picker.md)
* [Upload](/powershell-universal/da/apps/components/inputs/upload.md)

## Stepper

```powershell
New-UDStepper -Steps {
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 1" }
        New-UDTextbox -Id 'txtStep1' -Value $EventData.Context.txtStep1
    } -Label "Step 1"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 2" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep2' -Value $EventData.Context.txtStep2
    } -Label "Step 2"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 3" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep3' -Value $EventData.Context.txtStep3
    } -Label "Step 3"
} -OnFinish {
    New-UDTypography -Text 'Nice! You did it!' -Variant h3
    New-UDElement -Tag 'div' -Id 'result' -Content {$Body}
}
```

Variablen $Body vil indeholde en JSON-streng, der indeholder stepperens aktuelle tilstand. De vil modtage oplysninger om de felter, der er defineret i stepperen, og oplysninger om det aktuelle trin, der er fuldført. JSON-strengen $Body vil have følgende format.

```javascript
{
    context: {
        txtStep1: "value1",
        txtStep2: "value2",
        txtStep3: "value3"
    },
    currentStep: 0
}
```

## Validering af et trin

De kan validere et trin i en stepper ved at angive parameteren `OnValidateStep`. Scriptblokken modtager en $Body-variabel med JSON, der giver oplysninger om stepperens aktuelle tilstand. De skal returnere et valideringsresultat ved hjælp af `New-UDValidationResult` for at angive, om det aktuelle trins tilstand er gyldig.

JSON-payloaden vil have følgende format. Bemærk, at trin er 0-indekserede. Hvis De vil validere det første trin, skal De kontrollere, at trinnet er 0.

```javascript
{
    context: {
        field1: "value1" 
    },
    currentStep: 0
}
```

De er nødt til at konvertere JSON-strengen til et objekt, der kan arbejdes med i PowerShell, og derefter returnere valideringsresultatet.

```powershell
New-UDStepper -Steps {
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 1" }
        New-UDTextbox -Id 'txtStep1' -Value $EventData.Context.txtStep1
    } -Label "Step 1"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 2" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep2' -Value $EventData.Context.txtStep2
    } -Label "Step 2"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 3" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep3' -Value $EventData.Context.txtStep3
    } -Label "Step 3"
} -OnFinish {
    New-UDTypography -Text 'Nice! You did it!' -Variant h3
    New-UDElement -Tag 'div' -Id 'result' -Content {$Body}
} -OnValidateStep {
    $Context = $EventData
    if ($Context.CurrentStep -eq 0 -and $Context.Context.txtStep1 -eq 'bad')
    {
        New-UDValidationResult 
    }
    else
    {
        New-UDValidationResult -Valid 
    }
}
```

## Overspringning af trin

De kan sende brugeren til et bestemt trin i hændelseshandleren `OnValidateStep`. Brug `New-UDValidationResult` `-ActiveStep`-parameteren til at flytte brugeren til et hvilket som helst trin, efter der er klikket på næste. Trinindekser er 0-baserede.

Dette eksempel flytter brugeren til det sidste trin, efter at det første trin er fuldført.

```powershell
New-UDStepper -Steps {
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 1" }
        New-UDTextbox -Id 'txtStep1' -Value $EventData.Context.txtStep1
    } -Label "Step 1"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 2" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep2' -Value $EventData.Context.txtStep2
    } -Label "Step 2"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 3" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep3' -Value $EventData.Context.txtStep3
    } -Label "Step 3"
} -OnFinish {
    New-UDTypography -Text 'Nice! You did it!' -Variant h3
    New-UDElement -Tag 'div' -Id 'result' -Content {$Body}
} -OnValidateStep {
    $Context = $EventData
    if ($Context.CurrentStep -eq 0 -and $Context.Context.txtStep1 -eq 'bad')
    {
        New-UDValidationResult 
    }
    else
    {
        New-UDValidationResult -Valid -ActiveStep 2
    }
}
```

## Deaktiver forrige knap

De kan deaktivere den forrige knap ved hjælp af parameteren `-DisablePrevious` for `New-UDValidationResult` .

Dette eksempel deaktiverer det forrige trin, når brugeren går fremad i stepperen.

```powershell
New-UDStepper -Steps {
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 1" }
        New-UDTextbox -Id 'txtStep1' -Value $EventData.Context.txtStep1
    } -Label "Step 1"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 2" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep2' -Value $EventData.Context.txtStep2
    } -Label "Step 2"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 3" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep3' -Value $EventData.Context.txtStep3
    } -Label "Step 3"
} -OnFinish {
    New-UDTypography -Text 'Nice! You did it!' -Variant h3
    New-UDElement -Tag 'div' -Id 'result' -Content {$Body}
} -OnValidateStep {
    New-UDValidationResult -Valid -DisablePrevious
}
```

## Lodrette steppers

De kan oprette en lodret stepper ved at angive parameteren `-Orientation` til vertical.

```powershell
New-UDStepper -Steps {
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 1" }
        New-UDTextbox -Id 'txtStep1' -Value $EventData.Context.txtStep1
    } -Label "Step 1"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 2" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep2' -Value $EventData.Context.txtStep2
    } -Label "Step 2"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 3" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep3' -Value $EventData.Context.txtStep3
    } -Label "Step 3"
} -OnFinish {
    New-UDTypography -Text 'Nice! You did it!' -Variant h3
    New-UDElement -Tag 'div' -Id 'result' -Content {$Body}
} -Orientation 'vertical'
```

## API

* [New-UDStepper](/powershell-universal/da/powershell-kommandoer/new-udstepper.md)
* [New-UDStep](/powershell-universal/da/powershell-kommandoer/new-udstep.md)
* [New-UDValidationResult](/powershell-universal/da/powershell-kommandoer/new-udvalidationresult.md)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.devolutions.net/powershell-universal/da/apps/components/navigation/stepper.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.