Simple select - working version with searchbox outside
This commit is contained in:
parent
1eb7202561
commit
ca4aab4002
@ -4,15 +4,22 @@
|
|||||||
|
|
||||||
@inherits InputBase;
|
@inherits InputBase;
|
||||||
|
|
||||||
<div class="@InputFieldClassList">
|
@if (Items is not null)
|
||||||
<select @bind="@Value" @oninput="@ChangeValueAsync">
|
{
|
||||||
|
<div class="@InputFieldClassList">
|
||||||
@if (EnableSearch)
|
@if (EnableSearch)
|
||||||
{
|
{
|
||||||
<InputText @bind-Value="@SearchText" ValueChanged=""></InputText>
|
<TextInput Placeholder="Enter search.."
|
||||||
|
@bind-Value="@SearchText" />
|
||||||
}
|
}
|
||||||
@foreach(SelectItem<ValueType> item in Items)
|
<select @onchange="@ChangeValueAsync">
|
||||||
{
|
@foreach (ValueType item in Items)
|
||||||
<option value="@item.Value">@item.DisplayedText</option>
|
{
|
||||||
}
|
@if (item is not null)
|
||||||
</select>
|
{
|
||||||
</div>
|
<option value="@item">@item.ToString()</option>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
}
|
@ -1,5 +1,6 @@
|
|||||||
using Connected.Models;
|
using Connected.Models;
|
||||||
using Microsoft.AspNetCore.Components;
|
using Microsoft.AspNetCore.Components;
|
||||||
|
using Microsoft.AspNetCore.Components.Web;
|
||||||
using System;
|
using System;
|
||||||
|
|
||||||
namespace Connected.Components;
|
namespace Connected.Components;
|
||||||
@ -9,30 +10,51 @@ public partial class SimpleSelect<ValueType> : InputBase
|
|||||||
public ValueType Value { get; set; }
|
public ValueType Value { get; set; }
|
||||||
|
|
||||||
[Parameter]
|
[Parameter]
|
||||||
public IEnumerable<SelectItem<ValueType>> Items { get; set; }
|
public IEnumerable<ValueType> Items { get; set; }
|
||||||
|
|
||||||
public IEnumerable<SelectItem<ValueType>> OriginalItems { get; set; }
|
public IEnumerable<ValueType> OriginalItems { get; set; }
|
||||||
|
|
||||||
[Parameter]
|
[Parameter]
|
||||||
public bool EnableSearch { get; set; } = true;
|
public bool EnableSearch { get; set; } = true;
|
||||||
public string SearchText { get; set; }
|
|
||||||
|
|
||||||
public void FilterItems()
|
private string _searchText { get; set; } = string.Empty;
|
||||||
|
public string SearchText
|
||||||
{
|
{
|
||||||
Items= Items.Where(item => item.Value.ToString().ToLower().Contains(SearchText.ToLower()) || item.DisplayedText.ToString().ToLower().Contains(SearchText.ToLower()));
|
get
|
||||||
|
{
|
||||||
|
return _searchText;
|
||||||
|
}
|
||||||
|
set
|
||||||
|
{
|
||||||
|
_searchText = value;
|
||||||
|
FilterItems();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private async Task FilterItems()
|
||||||
|
{
|
||||||
|
if (string.IsNullOrEmpty(_searchText))
|
||||||
|
{
|
||||||
|
Items = OriginalItems;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
Items = Items.Where(item => item.ToString().ToLower().Contains(_searchText.ToLower()));
|
||||||
|
}
|
||||||
|
StateHasChanged();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
[Parameter]
|
[Parameter]
|
||||||
public EventCallback<ValueType> ValueChanged { get; set; }
|
public EventCallback<ValueType> ValueChanged { get; set; }
|
||||||
|
|
||||||
private async Task ChangeValueAsync(ChangeEventArgs args)
|
private async Task ChangeValueAsync(ChangeEventArgs args)
|
||||||
{
|
{
|
||||||
await ValueChanged.InvokeAsync((ValueType)Convert.ChangeType(args.Value, typeof(ValueType)));
|
await ValueChanged.InvokeAsync((ValueType)Convert.ChangeType(args.Value, typeof(ValueType)));
|
||||||
}
|
}
|
||||||
|
|
||||||
protected override async Task OnParametersSetAsync()
|
protected override async Task OnParametersSetAsync()
|
||||||
{
|
{
|
||||||
if (base.InputAttributes is null) base.InputAttributes = new();
|
if (base.InputAttributes is null) base.InputAttributes = new();
|
||||||
if (base.Required)
|
if (base.Required)
|
||||||
{
|
{
|
||||||
@ -40,6 +62,5 @@ public partial class SimpleSelect<ValueType> : InputBase
|
|||||||
}
|
}
|
||||||
OriginalItems = Items;
|
OriginalItems = Items;
|
||||||
await base.OnInitializedAsync();
|
await base.OnInitializedAsync();
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
Loading…
x
Reference in New Issue
Block a user