Autocomplete

L'autocomplete è un normale input di testo arricchito da un pannello di opzioni suggerite.

Elenco statico di opzioni

Crea un autocomplete di base con un elenco statico di opzioni

New-UDAutocomplete -Options @('Test', 'Test2', 'Test3', 'Test4')

Elenco dinamico di opzioni

Quando si digita del testo, è possibile filtrarlo con OnLoadOptions. $Body conterrà il testo attualmente digitato.

Questo esempio filtra l'array con Where-Object.

New-UDAutocomplete -OnLoadOptions { 
    @('Test', 'Test2', 'Test3', 'Test4') | Where-Object { $_ -like "*$Body*" } | ConvertTo-Json
}

OnChange

$Body contiene l'elemento attualmente selezionato. L'evento OnChange viene attivato quando l'utente seleziona uno o più elementi.

New-UDAutocomplete -OnLoadOptions { 
    @('Test', 'Test2', 'Test3', 'Test4') | Where-Object { $_ -like "*$Body*" } | ConvertTo-Json
} -OnChange {
    Show-UDToast $Body 
}

Icona

È possibile inserire un'icona prima di un autocomplete utilizzando il parametro -Icon.

New-UDAutocomplete -Options @("Test", "No", "Yes") -Icon (New-UDIcon -Icon 'Users') 

OnEnter

OnEnter viene attivato quando l'utente preme il tasto Invio all'interno dell'autocomplete.

New-UDAutocomplete -Options @("Test", "No", "Yes") -onEnter {
    Show-UDToast ((Get-UDElement -Id 'ac').value)
} -Id 'ac'

Opzioni

È possibile utilizzare New-UDAutoCompleteOption per specificare nomi e valori.

New-UDAutocomplete -Options @(
    New-UDAutoCompleteOption -Name 'Adam D' -Value '1'
    New-UDAutoCompleteOption -Name 'Sarah F' -Value '2'
    New-UDAutoCompleteOption -Name 'Tom S' -Value '3'
)

API

• New-UDAutocomplete