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)
|
||||||
|
{
|
||||||
|
<option value="@item">@item.ToString()</option>
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</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,17 +10,38 @@ 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();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@ -41,5 +63,4 @@ 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