Fixed DropDown, DropDownDataGrid and ListBox filtering input logic

radzenhq · Jul 28, 2023 · 3dde8c5 · 3dde8c5
1 parent 9207ef3
commit 3dde8c5
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 10 deletions.
diff --git a/Radzen.Blazor/DropDownBase.cs b/Radzen.Blazor/DropDownBase.cs
@@ -53,7 +53,7 @@ public Microsoft.AspNetCore.Components.Web.Virtualization.Virtualize<object> Vir
 
             if (LoadData.HasDelegate)
             {
-                await LoadData.InvokeAsync(new Radzen.LoadDataArgs() { Skip = request.StartIndex, Top = request.Count, Filter = await JSRuntime.InvokeAsync<string>("Radzen.getInputValue", search) });
+                await LoadData.InvokeAsync(new Radzen.LoadDataArgs() { Skip = request.StartIndex, Top = request.Count, Filter = searchText });
             }
 
             virtualItems = (LoadData.HasDelegate ? Data : view.Skip(request.StartIndex).Take(top)).Cast<object>().ToList();
@@ -702,7 +702,6 @@ async Task DebounceFilter()
         {
             if (!LoadData.HasDelegate)
             {
-                searchText = await JSRuntime.InvokeAsync<string>("Radzen.getInputValue", search);
                 _view = null;
                 if (IsVirtualizationAllowed())
                 {
@@ -781,14 +780,14 @@ internal virtual async System.Threading.Tasks.Task<LoadDataArgs> GetLoadDataArgs
 #if NET5_0_OR_GREATER
             if (AllowVirtualization)
             {
-                return new Radzen.LoadDataArgs() { Skip = 0, Top = PageSize, Filter = await JSRuntime.InvokeAsync<string>("Radzen.getInputValue", search) };
+                return new Radzen.LoadDataArgs() { Skip = 0, Top = PageSize, Filter = searchText };
             }
             else
             {
-                return new Radzen.LoadDataArgs() { Filter = await JSRuntime.InvokeAsync<string>("Radzen.getInputValue", search) };
+                return new Radzen.LoadDataArgs() { Filter = searchText };
             }
 #else
-            return new Radzen.LoadDataArgs() { Filter = await JSRuntime.InvokeAsync<string>("Radzen.getInputValue", search) };
+            return new Radzen.LoadDataArgs() { Filter = searchText };
 #endif
         }
 

diff --git a/Radzen.Blazor/RadzenDropDown.razor b/Radzen.Blazor/RadzenDropDown.razor
@@ -104,7 +104,8 @@
             {
                 <div class="rz-dropdown-filter-container">
                     <input id="@SearchID" @ref="@search" tabindex="@(Disabled ? "-1" : $"{TabIndex}")" class="rz-dropdown-filter rz-inputtext   " autocomplete="off" type="text"
-                           @onchange="@((ChangeEventArgs args) => OnFilter(args))" @onkeydown="@((args) => OnFilterKeyPress(args))" value="@searchText" />
+                           @onchange="@((ChangeEventArgs args) => OnFilter(args))" @onkeydown="@((args) => OnFilterKeyPress(args))" value="@searchText"
+                           @oninput=@(args => searchText = $"{args.Value}")/>
                     <span class="rz-dropdown-filter-icon rzi rzi-search"></span>
                 </div>
             }
@@ -131,7 +132,7 @@
                         <div class="rz-multiselect-filter-container">
                             <input id="@SearchID" tabindex="@(Disabled ? "-1" : $"{TabIndex}")" class="rz-inputtext" role="textbox" type="text"
                                    onclick="Radzen.preventDefaultAndStopPropagation(event)"
-                                   @ref="@search"
+                                   @ref="@search" @oninput=@(args => searchText = $"{args.Value}")
                                    @onchange="@((args) => OnFilter(args))" @onkeydown="@((args) => OnFilterKeyPress(args))" value="@searchText" />
                             <span class="rz-multiselect-filter-icon rzi rzi-search"></span>
                         </div>

diff --git a/Radzen.Blazor/RadzenDropDownDataGrid.razor b/Radzen.Blazor/RadzenDropDownDataGrid.razor
@@ -115,7 +115,8 @@
                 {
                     <div class="rz-lookup-search">
                         <input class="rz-lookup-search-input" id="@SearchID" @ref="@search" tabindex="-1" placeholder="@SearchText"
-                               @onchange="@((args) => OnFilter(args))" @onkeydown="@((args) => OnFilterKeyPress(args))" value="@searchText" style="@(ShowSearch ? "" : "margin-right:0px;")" />
+                               @onchange="@((args) => OnFilter(args))" @onkeydown="@((args) => OnFilterKeyPress(args))" value="@searchText" style="@(ShowSearch ? "" : "margin-right:0px;")"
+                               @oninput=@(args => searchText = $"{args.Value}")/>
                         @if (ShowSearch)
                         {
                             <button class="rz-button rz-button-md rz-button-icon-only rz-primary" type="button" title="" @onclick="@((args) => OnFilter(new ChangeEventArgs()))">

diff --git a/Radzen.Blazor/RadzenDropDownDataGrid.razor.cs b/Radzen.Blazor/RadzenDropDownDataGrid.razor.cs
@@ -586,7 +586,6 @@ protected override async Task OnFilterKeyPress(KeyboardEventArgs args)
 
         async Task DebounceFilter()
         {
-            searchText = await JSRuntime.InvokeAsync<string>("Radzen.getInputValue", search);
             if (searchText != previousSearch)
             {
                 previousSearch = searchText;

diff --git a/Radzen.Blazor/RadzenListBox.razor b/Radzen.Blazor/RadzenListBox.razor
@@ -36,7 +36,8 @@
                 {
                     <div class="rz-listbox-filter-container">
                         <input id="@SearchID" @ref="@search" disabled="@Disabled" class="rz-inputtext" role="textbox" type="text" placeholder="@Placeholder"
-                               @onchange="@((args) => OnFilter(args))" @onkeydown="@((args) => OnFilterKeyPress(args))" value="@searchText" @onkeydown:stopPropagation="true" />
+                               @onchange="@((args) => OnFilter(args))" @onkeydown="@((args) => OnFilterKeyPress(args))" value="@searchText" @onkeydown:stopPropagation="true"
+                               @oninput=@(args => searchText = $"{args.Value}") />
                         <span class="rz-listbox-filter-icon rzi rzi-search"></span>
                     </div>
                 }