1
0

Apply two-way data binding for search bar.

This commit is contained in:
Kevin Matsubara 2025-03-25 23:43:06 +01:00
parent 1ebbced64b
commit b02d6d2bb9

View File

@ -26,7 +26,9 @@
<br/>
<div class="input-group mb-3">
<input type="text" class="form-control" placeholder="Search servers" @onchange="HandleServerFilterChange" />
<input type="text" class="form-control" placeholder="Search servers"
@bind-value="serverFilter"
@bind-value:event="oninput" />
<button class="btn btn-outline-secondary" type="button" id="button-search" @onclick="HandleSearch">Search</button>
</div>
<br/>
@ -58,7 +60,16 @@
private List<string> cities = ServersRepository.GetCities();
private List<Server> servers = ServersRepository.GetServersByCity("Eindhoven");
private string selectedCity = "Eindhoven";
private string serverFilter = "";
private string _serverFilter = "";
private string serverFilter {
get => _serverFilter;
set
{
_serverFilter = value;
this.servers = ServersRepository.SearchServers(_serverFilter);
this.selectedCity = string.Empty;
}
}
private void DeleteServer(int serverId)
{
@ -75,11 +86,6 @@
this.servers = ServersRepository.GetServersByCity(this.selectedCity);
}
private void HandleServerFilterChange(ChangeEventArgs args)
{
serverFilter = args.Value?.ToString() ?? string.Empty;
}
private void HandleSearch()
{
this.servers = ServersRepository.SearchServers(serverFilter);