Add InputList control to select values from a dictionary of string

The control accepts a dictionary of string that can be searched using an input control.
Pages Add and Edit have implemented the control to render the list of Icons found in the Oqtane Shared namespace.
This commit is contained in:
Leigh Pointer
2023-08-22 09:50:59 +02:00
parent 3729b8eac2
commit 09f1d3ca15
3 changed files with 74 additions and 5 deletions

View File

@ -0,0 +1,31 @@
@namespace Oqtane.Modules.Controls
@using System.Linq.Expressions;
@inherits ModuleControlBase
<input type="text" value="@Value" list="Dictionarylist" class="form-select" @onchange="(e => OnChange(e))" />
<datalist id="Dictionarylist" value="@Value">
@foreach(var iv in InputValues)
{
<option value="@iv.Value">@iv.Key</option>
}
</datalist>
@code {
[Parameter]
public string Value { get; set; }
[EditorRequired]
[Parameter]
public Dictionary<string, string> InputValues { get; set; }
[EditorRequired]
[Parameter]
public EventCallback<string> ValueChanged { get; set; }
protected void OnChange(ChangeEventArgs e)
{
if (string.IsNullOrWhiteSpace(e.Value.ToString())) { return; }
Value = e.Value.ToString();
if (ValueChanged.HasDelegate)
{
ValueChanged.InvokeAsync(Value);
}
}
}