> 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/de/apps/components/data-display/data-grid.md).

# Data Grid

Die Komponente `UDDataGrid` ist eine erweiterte Version der Tabelle, die zum Anzeigen großer Datenmengen nützlich ist. Sie unterstützt viele der gleichen Funktionen wie die Tabelle, bietet aber zusätzlich komplexe Filterung, Zeilenvirtualisierung, mehrspaltige Sortierung und mehr.

## Einfaches Data Grid

![](/files/DYJ7h2cd9facjlvFPaxn)

Data Grids laden ihre Daten über den Event-Handler `-LoadRows`. Sie müssen eine Hashtable zurückgeben, die die Zeilendaten und die Gesamtanzahl der Zeilen enthält.

Spalten werden mithilfe von Hashtables definiert.

```powershell
New-UDDataGrid -LoadRows {
    $Data = @(
        @{ Name = 'Adam'; Number = Get-Random}
        @{ Name = 'Tom'; Number = Get-Random}
        @{ Name = 'Sarah'; Number = Get-Random}
    )
    $Data | Out-UDDataGridData -Context $EventData -TotalRows $Rows.Length
} -Columns @(
    New-UDDataGridColumn -Field name
    New-UDDataGridColumn -Field number
) -AutoHeight $true
```

## Spalten

Spalten können mit `New-UDDataGridColumn` angepasst werden. Weitere Informationen zu diesem Cmdlet finden Sie [hier](/powershell-universal/de/powershell-befehle/new-uddatagridcolumn.md).

### Benutzerdefinierte Spalten rendern

Sie können benutzerdefinierte Komponenten in Spalten rendern, indem Sie `render` innerhalb der Spalten-Hashtable angeben. Auf die Daten der aktuellen Zeile können Sie über die Variable `$EventData` oder `$Row` zugreifen

In diesem Beispiel wird die Zahl in der Namensspalte mit einer `New-UDTypography`-Komponente angezeigt.

```powershell
New-UDDataGrid -LoadRows {  
    $Rows = 1..100 | % {
        @{ Name = 'Adam'; Number = Get-Random}
    }
    $Rows| Out-UDDataGridData -Context $EventData -TotalRows $Rows.Length
} -Columns @(
    New-UDDataGridColumn -Field name -Render {
         New-UDTypography $EventData.number 
    }
    New-UDDataGridColumn -Field number
) -AutoHeight $true
```

### Spalten mit flexibler Breite

Spaltenfluidität oder Responsivität kann erreicht werden, indem die Eigenschaft `flex` einer Spalte gesetzt wird.

Die Eigenschaft `flex` akzeptiert einen Wert zwischen 0 und ∞. Sie funktioniert, indem der verbleibende Platz im Raster proportional zu ihrem `flex`-Wert auf alle Flex-Spalten verteilt wird.

Betrachten Sie zum Beispiel ein Raster mit einer Gesamtbreite von 500px, das drei Spalten hat: die erste mit `width: 200`, die zweite mit `flex: 1` und die dritte mit `flex: 0.5`. Die erste Spalte wird 200px breit sein, wodurch 300px übrig bleiben. Die Spalte mit `flex: 1` ist doppelt so groß wie `flex: 0.5`, was bedeutet, dass die endgültigen Größen folgende sind: 200px, 200px, 100px.

Um eine minimale und maximale Breite für eine `flex`-Spalte festzulegen, setzen Sie die Eigenschaften `minWidth` und `maxWidth` an der Spalte.

```powershell
New-UDDataGrid -LoadRows {  
    $Rows = 1..100 | % {
        @{ Name = 'Adam'; Number = "This column is a very long string. This column is a very long string. This column is a very long string. This column is a very long string. This column is a very long string. This column is a very long string."}
    }        
    $Rows| Out-UDDataGridData -Context $EventData -TotalRows $Rows.Length
} -Columns @(
    New-UDDataGridColumn -Field name -Render {
         New-UDTypography $EventData.number 
    }
    New-UDDataGridColumn -Field number -Flex 1.0
) -AutoHeight $true
```

### Spalten automatisch dimensionieren

Wenn Sie möchten, dass das Data Grid die Spaltenbreiten automatisch dimensioniert, können Sie den Parameter `-AutoSizeColumns` von `New-UDDataGrid` verwenden. Das Data Grid wertet die Größe der Daten aus und ermittelt nach dem Laden der Daten die beste Größe für die Spalten. Dies kann nach dem Laden der Daten zu einer gewissen Neuanordnung der Benutzeroberfläche führen.

```powershell
New-UDDataGrid -LoadRows {  
    $Rows = 1..100 | % {
        @{ Name = 'Adam'; Number = "This column is a very long string. This column is a very long string. This column is a very long string. This column is a very long string. This column is a very long string. This column is a very long string."}
    }        
    $Rows| Out-UDDataGridData -Context $EventData -TotalRows $Rows.Length
} -Columns @(
    New-UDDataGridColumn -Field name -Render {
         New-UDTypography $EventData.number 
    }
    New-UDDataGridColumn -Field number
) -AutoHeight $true -AutoSizeColumns
```

## LoadRows

Der Parameter `-LoadRows` wird verwendet, um Daten für das Data Grid zurückzugeben. Der Tabellenstatus wird dem Event-Handler als `$EventData` bereitgestellt. Sie finden die folgenden Eigenschaften innerhalb des `$EventData`-Objekts.

| Eigenschaft | Beschreibung                                                          | Typ       |
| ----------- | --------------------------------------------------------------------- | --------- |
| Filter      | Ein Filterobjekt, mit dem Sie Filter für Ihre Daten erstellen können. | Hashtable |
| Page        | Die aktuelle Seite. Beginnt bei 0.                                    | Integer   |
| PageSize    | Die Anzahl der Datensätze auf einer Seite.                            | Integer   |
| Sort        | Die Sortieroptionen für die Tabelle                                   | Hashtable |

## Paging

Um Paging zu implementieren, können Sie auf die Eigenschaften `page` und `pageSize` der Variable `$EventData` zugreifen. Wenn Sie eine remote Datenquelle verwenden, sollten Sie eine benutzerdefinierte Paging-Logik implementieren. Unten finden Sie ein Beispiel für die Verwendung der Paging-Eigenschaften, um lokal durch die Zeilen zu blättern. Abhängig von Ihrer Datenquelle (z. B. SQL) können Sie Daten anders durchblättern.

```powershell
New-UDDataGrid -LoadRows {  
    $Rows = 1..100 | % {
        @{ Name = 'Adam'; Number = Get-Random}
    } 
    
    $Rows = $Rows | Select-Object -First $EventData.pageSize -Skip ($EventData.Page * $EventData.PageSize)
    
    $Rows| Out-UDDataGridData -Context $EventData -TotalRows $Rows.Length
} -Columns @(
    New-UDDataGridColumn -Field name
    New-UDDataGridColumn -Field number
) -AutoHeight $true -Pagination
```

`Out-UDDataGridData` implementiert Paging automatisch, und Sie müssen das oben Genannte nicht tun, wenn sich alle Ihre Daten im Speicher befinden. Das oben Genannte dient nur zu Demonstrationszwecken.

## Filterung

Das Data Grid unterstützt das Filtern von Daten anhand jeder Spalte. Es können mehrere Filter definiert werden, damit der Benutzer den angezeigten Datensatz eingrenzen kann. Standardmäßig implementiert das Cmdlet `Out-UDDataGridData` die Filterung für lokale Daten. Bei Verwendung einer remote Datenquelle wie SQL wird empfohlen, eine benutzerdefinierte Filterung zu implementieren, um die Benutzererfahrung und Leistung zu verbessern.

![](/files/xXrlI2cnuA66XaQ8Bian)

### Datenstruktur des Filters

Das Filterobjekt ist in `$EventData` für den Event-Handler `-LoadRows` enthalten, wenn ein Filter definiert ist. Das Objekt hat die folgende Struktur.

```powershell
@{
    items = @(
        @{ 
            field = "Name"
            operator = "contains"
            value = "test"
        }
    )
    logicOperator = "and"
    quickFilterValues = @("test")
    quickFilterLogicOperator = "and"
}
```

#### Items

Die Eigenschaft items enthält eine Sammlung von Feldern, Operatoren und Werten. Sie können diese verwenden, um Ihre Daten zu filtern.

| Eigenschaft | Beschreibung                                                       | Typ    |
| ----------- | ------------------------------------------------------------------ | ------ |
| Field       | Der Name des zu filternden Feldes                                  | String |
| Operator    | Der Operatortyp, der beim Filtern der Daten verwendet werden soll. | String |
| Value       | Der Wert, der zum Filtern verwendet wird                           | Object |

#### LogicOperator

Das Feld für den Logikoperator wird verwendet, um die Verknüpfung zwischen den Filtern anzugeben. Dies kann `and` oder `or` sein.

#### QuickFilterValues

Enthält eine Sammlung von Schnellfilterwerten, bei denen Sie wählen können, wie Sie sie auf Ihre Daten anwenden.

#### QuickFilterLogicOperator

Enthält den Logikoperator für die vom Benutzer angegebenen Schnellfilterwerte. Dies kann `and` oder `or` sein.

### Benutzerdefinierter Filter

Das Cmdlet `Out-UDDataGridData` bietet eine Implementierung der Filterung für statische Daten. Wenn Sie dieses Cmdlet verwenden, müssen Sie die Filterung nicht manuell implementieren. Wenn Sie eine remote Datenquelle haben, sollten Sie eine benutzerdefinierte Implementierung für die Filterung bereitstellen. Unten finden Sie ein Beispiel für die Verwendung der Filterstruktur in `$EventData`, um Zeilen anhand der vom Benutzer bereitgestellten Filter zu eliminieren.

```powershell
New-UDDataGrid -LoadRows {  
    $Rows = 1..100 | % {
        @{ Name = 'Adam'; Number = Get-Random}
    }

    foreach($filter in $eventData.Filter.items)
    {
        if ($filter.operator -eq 'equals')
        {
            $Rows = $Rows | Where-Object $filter.field -eq $filter.value
        }
        elseif ($filter.operator -eq 'contains')
        {
            $Rows = $Rows | Where-Object $filter.field -match $filter.value
        }
    }

    $Rows| Out-UDDataGridData -Context $EventData -TotalRows $Rows.Length
} -Columns @(
    New-UDDataGridColumn -Field name
    New-UDDataGridColumn -Field number
) -AutoHeight $true
```

### Benutzerdefinierter Schnellfilter

Der Schnellfilter ähnelt einem einfachen Suchfeld. Sie können die Schnellfilterung mit dem Parameter `-ShowQuickFilter` an `New-UDDataGrid` aktivieren. Oben rechts im Data Grid wird ein Suchfeld angezeigt. Wenn der Benutzer einen Wert in das Data Grid eingibt, werden die Schnellfilterinformationen bereitgestellt.

Unten finden Sie ein Beispiel für die Verwendung von Schnellfiltern. `Out-UDDataGridData` implementiert die Schnellfilterung und ist bei Verwendung lokaler Daten nicht erforderlich. Das Folgende dient nur zur Demonstration.

```powershell
New-UDDataGrid -LoadRows {  
    $Rows = 1..100 | % {
        @{ Name = 'Adam'; Number = Get-Random}
    }

    foreach($filter in $eventData.QuickFilterValues)
    {
        $Rows = $Rows | Where-Object $filter.field -match $filter
    }

    $Rows| Out-UDDataGridData -Context $EventData -TotalRows $Rows.Length
} -Columns @(
    New-UDDataGridColumn -Field name
    New-UDDataGridColumn -Field number
) -AutoHeight $true
```

## Sortierung

![](/files/GL4CyJV9C7sDwBwfQwtE)

Das `$EventData`-Objekt enthält eine Eigenschaft `Sort`, wenn der Benutzer das Data Grid sortiert. Sie enthält Eigenschaften für jede sortierte Spalte. Die Eigenschaften beginnen bei 0 und werden erhöht, wenn weitere Spalten sortiert werden.

Zum Beispiel können Sie auf die erste sortierte Spalte wie folgt zugreifen.

```powershell
$EventData.Sort.'0'.field
```

Sie erhalten außerdem die Sortierrichtung für jede Spalte.

| Eigenschaft | Beschreibung                                 | Typ       |
| ----------- | -------------------------------------------- | --------- |
| Field       | Das zu sortierende Feld.                     | String    |
| Sort        | Die Richtung, in die das Feld sortiert wird. | asc, desc |

## Detaillierter Inhalt

<figure><img src="/files/IYaE4dva5MMcj0en90gF" alt=""><figcaption></figcaption></figure>

Sie können den Event-Handler `-LoadDetailContent` verwenden, um zusätzliche Informationen über die Zeile anzuzeigen, die Sie erweitern. Informationen zur aktuellen Zeile sind in `$EventData.row` verfügbar.

```powershell
New-UDDataGrid -LoadRows {
    $Data = @(
        @{ Name = 'Adam'; Number = Get-Random }
        @{ Name = 'Tom'; Number = Get-Random }
        @{ Name = 'Sarah'; Number = Get-Random }
    )
    $Data| Out-UDDataGridData -Context $EventData -TotalRows $Data.Length
} -Columns @(
    New-UDDataGridColumn -Field name
    New-UDDataGridColumn -Field number
) -AutoHeight $true -LoadDetailContent {
    Show-UDToast $Body
    New-UDAlert -Text $EventData.row.Name
}
```

### Beispiel: Verschachtelte Data Grids

Sie können den Parameter -LoadDetailContent verwenden, um verschachtelte Daten zu einem Objekt abzurufen. In diesem Beispiel laden wir ein Data Grid mit virtuellen Maschinen und zeigen den Namen, das Betriebssystem, den Speicher und die CPU-Kerne an. Das Erweitern des Detailinhalts liefert ein Data Grid der auf der virtuellen Maschine verfügbaren Netzwerkkarten. Wir verwenden in diesem Beispiel Dummy-Daten, Sie könnten jedoch jedes für PowerShell Universal verfügbare Cmdlet verwenden.

```powershell
function Get-VirtualMachine {
    1..10 | ForEach-Object {
        [PSCustomObject]@{
            Name = "VM-$_"
            OperatingSystem = @("Windows Server 2019", "Windows Server 2022", "Ubuntu 20.02") | Get-Random
            Memory = @(64, 128, 512, 1024) | Get-Random
            Cores = @(8, 16, 32) | Get-Random
        }
    }
}

function Get-NetworkCard {
    param($VirtualMachine)

    1..4 | ForEach-Object {
        [PSCustomObject]@{
            Name = "NIC-$_"
            Speed = @(64, 128, 512, 1024) | Get-Random
        }
    }
}

New-UDApp -Content { 
    New-UDDataGrid -LoadRows {
        $VMs = Get-VirtualMachine
        $VMs| Out-UDDataGridData -Context $EventData -TotalRows $VMs.Length
    } -Columns @(
        New-UDDataGridColumn -Field Name
        New-UDDataGridColumn -Field OperatingSystem
        New-UDDataGridColumn -Field Memory -Render {
            New-UDTypography -Text "$($EventData.Memory) GB\s"
        }
        New-UDDataGridColumn -Field Cores
    ) -AutoHeight $true -LoadDetailContent {
        $VirutalMachine = $EventData.row
        New-UDDataGrid -LoadRows {
            $NICs = Get-NetworkCard -VirtualMachine $VirutalMachine
            $NICs | Out-UDDataGridData -Context $EventData -TotalRows $NICs.Length
        } -Columns @(
            New-UDDataGridColumn -Field Name
            New-UDDataGridColumn -Field Speed -Render {
                New-UDTypography -Text "$($EventData.Speed) GB\s"
            }
        ) -AutoHeight $true
    }
}
```

## Bearbeitung

Tabellen bieten Editor-Unterstützung, indem der Event-Handler `-OnEdit` angegeben wird. Die neuen Zeilendaten werden als `$EventData` bereitgestellt. Sie können wählen, aktualisierte Zeileninformationen zurückzugeben (zum Beispiel, um etwas anzupassen, das der Benutzer eingegeben hat) und diese aus dem Event-Handler zurückzugeben. Wenn Sie nichts zurückgeben, spiegelt die Zeile wider, was der Benutzer eingegeben hat.

Die `$EventData` hat das folgende Format.

```powershell
@{
    newRow = @{}
    oldRow = @{}
}
```

Stellen Sie sicher, dass Sie die Eigenschaft `editable` für jede Spalte angeben, die der Benutzer bearbeiten soll.

```powershell
$Cache:Data = @(
    @{ Name = 'Adam'; number = Get-Random }
    @{ Name = 'Tom'; number = Get-Random }
    @{ Name = 'Sarah'; number = Get-Random }
)

New-UDDataGrid -LoadRows {
    $Cache:Data| Out-UDDataGridData -Context $EventData -TotalRows $Cache:Data.Length
} -Columns @(
    New-UDDataGridColumn -Field name -Render {
        New-UDButton -Text $EventData.number
    }
    New-UDDataGridColumn -Field number -Editable
) -AutoHeight $true -OnEdit {
    $Cache:Data | Where-Object { $_.Name -eq $EventData.NewRow.Name } | ForEach-Object {
        $_.Number = $EventData.NewRow.Number
    }
}
```

## Auswahl

Sie können die Zeilenauswahl mit dem Parameter `-CheckboxSelection` aktivieren, um Kontrollkästchen für die auszuwählenden Zeilen anzuzeigen. Die Zeilenauswahl erfordert eine deterministische ID für die bereitgestellten Datenzeilen. Im folgenden Beispiel sehen Sie, dass für jede Zeile eine spezifische ID angegeben ist.

```powershell
New-UDApp -Content { 
    $Rows = 1..100 | % {
        @{ Id = $_; Name = 'Adam'; Number = Get-Random}
    } 
    New-UDDataGrid -id DataGrid -LoadRows {  
    $Rows| Out-UDDataGridData -Context $EventData -TotalRows $Rows.Length
} -Columns @(
    New-UDDataGridColumn -Field name
    New-UDDataGridColumn -Field number
) -AutoHeight $true -Pagination -CheckboxSelection -CheckboxSelectionVisibleOnly -DisableRowSelectionOnClick
```

Sie können auf ausgewählte Daten mit dem Event-Handler `-OnSelectionChange` oder durch Abrufen der Zeilen-IDs über `Get-UDElement` zugreifen.

```powershell
New-UDButton -Text 'Get Selected Rows' -OnClick {
   $Value = Get-UDElement -ID 'DataGrid'
   Show-UDToast $Value.selection
}
```

## Benutzerdefinierter Export

Um die Standard-Exportfunktionalität zu überschreiben, verwenden Sie den Event-Handler `-OnExport`. `$EventData` ist dasselbe Kontextobjekt, das für `-LoadRows` verwendet wird. Sie sollten `Out-UDDataGridExport` verwenden, um die Daten aus `-OnExport` zurückzugeben.

```powershell
$Data = @(
    @{ name = 'Adam'; Number = Get-Random}
    @{ name = 'Tom'; Number = Get-Random}
    @{ name = 'Sarah'; Number = Get-Random}
)

New-UDDataGrid -LoadRows {
    @{
        rows = $Data 
        rowCount = $Data.Length
    }
} -Columns @(
    New-UDDataGridColumn -Field name
    New-UDDataGridColumn -Field number
) -OnExport {
    $ExportContent = $Data | ConvertTo-Csv -NoTypeInformation | Out-String
    Out-UDDataGridExport -Data $ExportContent -FileName 'export.csv' 
}
```

### Mehrere Exporttypen

Bei Verwendung eines benutzerdefinierten Exports können Sie den Parameter `-ExportOptions` verwenden, um mehrere Exporttypen zu definieren. Wenn der Benutzer den Exporttyp auswählt, können Sie die Eigenschaft Type von `$EventData` prüfen, um zu bestimmen, welche Art von Export erzeugt werden soll.

```powershell
$Data = @(
    @{ name = 'Adam'; Number = Get-Random}
    @{ name = 'Tom'; Number = Get-Random}
    @{ name = 'Sarah'; Number = Get-Random}
)

New-UDDataGrid -LoadRows {
    @{
        rows = $Data 
        rowCount = $Data.Length
    }
} -Columns @(
    New-UDDataGridColumn -Field name
    New-UDDataGridColumn -Field number
) -OnExport {
    if ($EventData.Type -eq 'CSV')
    {
        $ExportContent = $Data | ConvertTo-Csv -NoTypeInformation | Out-String
        Out-UDDataGridExport -Data $ExportContent -FileName 'export.csv' 
    }
} -ExportOptions @("CSV", "PDF")
```

## Beispiel: Statische Daten

In diesem Beispiel generieren wir ein Array mit 10.000 Datensätzen. Wir erstellen eine neue Funktion, `Out-UDDataGridData`, um das Paging, die Sortierung und die Filterung zu verwalten. Diese Funktion ist bereits im [Universal-Modul](/powershell-universal/de/powershell-befehle/out-uddatagriddata.md) enthalten.

```powershell
New-UDApp -Title 'PowerShell Universal' -Content {
     $Data =  1..10000 | % {
        @{ Name = 'Adam'; Number = Get-Random }
    } 
    New-UDDataGrid -LoadRows {  
      $Data | Out-UDDataGridData -Context $EventData
    } -Columns @(
        New-UDDataGridColumn -Field name
        New-UDDataGridColumn -Field number -Render {
                    New-UDButton -Icon (New-UDIcon -Icon User) -OnClick { Show-UDToast $EventData.Name } 
        }
    ) -AutoHeight $true -Pagination -HeaderFilters
}     
```

<figure><img src="/files/g0a9JCGlvWpVTYfwEF4z" alt=""><figcaption></figcaption></figure>

## Beispiel: SQL-Daten

In diesem Beispiel fragen wir die PowerShell Universal-Datenbank mit dbatools ab.

```powershell
function Out-UDSQLDataGrid {
    param(
        $Context,
        [Parameter(Mandatory)]
        [string]$Table,
        [Parameter(Mandatory)]
        [string]$SqlInstance,
        [Parameter(Mandatory)]
        [string]$Database,
        [Parameter(Mandatory)]
        [pscredential]$SqlCredential,
        [Int32]$RowsPerPage
    )

    End {
        $simpleFilter = @()

        if ($null -ne $Context.Filter.Items -and $Context.Filter.Items.Count -gt 0) {
            $logicOperator = $Context.Filter.logicOperator #The link operator is 'AND' or 'OR'. It will always be one or the other for all properties

            foreach ($item in $Context.Filter.Items) {         
                $simpleFilter += [PSCustomObject]@{
                    Property = $item.Field
                    Value    = $item.Value
                    Operator = $item.Operator
                }
            }
        }

        if ($null -ne $simpleFilter -and $simpleFilter.Count -gt 0) {
            $count = 1
            foreach ($filter in $simpleFilter) {
                if ($count -gt 1) {               
                    $SqlFilter += " $($logicOperator) "
                }
                else {
                    $SqlFilter += " WHERE "
                }

                switch ($filter.Operator) {
                    "contains" { $SqlFilter += " $($filter.Property) LIKE '%$($filter.Value)%' " }
                    "equals" { $SqlFilter += " $($filter.Property) = '$($filter.Value)' " }
                    "startsWith" { $SqlFilter += " $($filter.Property) LIKE '$($filter.Value)%' " }
                    "endsWith" { $SqlFilter += " $($filter.Property) LIKE '%$($filter.Value)' " }
                    "isAnyOf" {
                        $count = 1
                        foreach ($val in $filter.Value) {
                            if ($count -gt 1) {
                                $list += ", '$val'"
                            }
                            else {
                                $list += "'$val'"
                            }  
                            $count += 1
                        }
                        $SqlFilter += " $($filter.Property) IN ($($list)) "
                    }
                    "isempty" { $SqlFilter += " TRIM ($($filter.Property)) IS NULL " }
                    "isnotempty" { $SqlFilter += " TRIM ($($filter.Property)) IS NOT NULL " }
                    "notequals" { $SqlFilter += " $($filter.Property) != '$($filter.Value)' " }
                    "notcontains" { $SqlFilter += " $($filter.Property) NOT LIKE '%$($filter.Value)%' " }
                }
                $count += 1
            }
        }
        else {
            $SqlFilter = $null
        }

        if ($null -eq $SqlFilter) {
            $totalCount = (Invoke-DbaQuery -SqlInstance $SqlInstance -Database $Database -SqlCredential $SqlCredential -Query "SELECT COUNT(*) As Count FROM $Table").Count
        }
        else {
            $totalCount = (Invoke-DbaQuery -SqlInstance $SqlInstance -Database $Database -SqlCredential $SqlCredential -Query "SELECT COUNT(*) As Count FROM $Table $SqlFilter").Count
            $sort = $Context.Sort.'0'
        }

        if ($sort) {
            $sqlSort = "ORDER BY $($sort.field) $($sort.Sort) "
        }
        else {
            $sqlSort = "ORDER BY (SELECT NULL)"
        }

        if ($null -ne $SqlFilter) {
            $sqlPage = "OFFSET $($Context.Page * $Context.PageSize) ROWS FETCH NEXT $($Context.PageSize) ROWS ONLY;"
            $Query = "SELECT * FROM $Table $sqlFilter $sqlSort $sqlPage"
        }
        else {
            $sqlPage = "OFFSET $($RowsPerPage) ROWS FETCH NEXT $($RowsPerPage) ROWS ONLY;"
            $Query = "SELECT * FROM $Table $sqlSort $sqlPage"
        }

        $Rows = Invoke-DbaQuery -SqlInstance $SqlInstance -Database $Database -SqlCredential $SqlCredential -Query $Query -As PSObject

        @{
            rows     = [Array]$Rows
            rowCount = $TotalCount
        }
    }   
}

New-UDDashboard -Title 'PowerShell Universal' -Content {
    New-UDDataGrid -LoadRows {  
      Out-UDSqlDataGrid -Context $EventData -SqlInstance "(localdb)\MSSQLLocalDb" -Database "PSU" -Table "Job"
    } -Columns @(
        New-UDDataGridColumn -Field id
        New-UDDataGridColumn -Field startTime
        New-UDDataGridColumn -Field status -Render {
          if ($EventData.Status -eq 2) {
                New-UDAlert -Severity 'Success' -Text 'Success'
            }

            if ($EventData.Status -eq 3) {
                New-UDAlert -Severity 'Error' -Text 'Failed'
            }
        }
    ) -AutoHeight $true -Pagination
}
```

<figure><img src="/files/8QdLbjVewqs5jp42GclW" alt=""><figcaption></figcaption></figure>

## API

* [New-UDDataGrid](/powershell-universal/de/powershell-befehle/new-uddatagrid.md)
* [New-UDDataGridColumn](/powershell-universal/de/powershell-befehle/new-uddatagridcolumn.md)
* [Out-UDDataGridData](/powershell-universal/de/powershell-befehle/out-uddatagriddata.md)
* [Out-UDDataGridExport](/powershell-universal/de/powershell-befehle/out-uddatagridexport.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 dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.devolutions.net/powershell-universal/de/apps/components/data-display/data-grid.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
