From 3610e0888b2a84ecbc413487aed7c3b5ba4a418f Mon Sep 17 00:00:00 2001 From: braia123 Date: Sat, 18 Oct 2025 19:39:19 +0800 Subject: [PATCH 1/6] =?UTF-8?q?AutoFill=E7=BB=84=E4=BB=B6=E5=8F=98?= =?UTF-8?q?=E5=8A=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit input输入Enter时，如候选项唯一，直接选中 当焦点从AutoFill移出时，如GetDisplayText(Value)对应的内容与input中的内容不符则清空Value和Input --- .../AutoComplete/AutoComplete.razor.js | 17 ++++++++- .../Components/AutoFill/AutoFill.razor | 3 +- .../Components/AutoFill/AutoFill.razor.cs | 37 +++++++++++++++++++ 3 files changed, 55 insertions(+), 2 deletions(-) diff --git a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js index c5a4af4744a..6cb13fcb597 100644 --- a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js +++ b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js @@ -150,9 +150,16 @@ export function init(id, invoke, value, changedEventCallback) { const handlerKeydown = (ac, e) => { const key = e.key; const { el, invoke, menu } = ac; - if (key === 'Enter') { + if (key === 'Enter' || key === 'NumpadEnter') { const skipEnter = el.getAttribute('data-bb-skip-enter') === 'true'; if (!skipEnter) { + const items = [...menu.querySelectorAll('.dropdown-item')]; + if (items.length === 1) { + // 当只有一个候选项时，直接触发点击 + items[0].click(); + invoke.invokeMethodAsync('EnterCallback'); + return; + } const current = menu.querySelector('.active'); if (current !== null) { current.click(); @@ -227,3 +234,11 @@ const scrollIntoView = (el, item) => { } export { handleKeyUp, select, selectAllByFocus, selectAllByEnter } + +export function getInputValue(id) { + const ac = Data.get(id); + if (ac && ac.input) { + return ac.input.value; + } + return ""; +} diff --git a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor index 831284deed3..959f66e69c0 100644 --- a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor +++ b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor @@ -14,7 +14,8 @@ data-bb-auto-dropdown-focus="@ShowDropdownListOnFocusString" data-bb-debounce="@DurationString" data-bb-skip-esc="@SkipEscString" data-bb-skip-enter="@SkipEnterString" data-bb-scroll-behavior="@ScrollIntoViewBehaviorString" - placeholder="@PlaceHolder" disabled="@Disabled" /> + placeholder="@PlaceHolder" disabled="@Disabled" + onblur="@OnBlur" /> @if (GetClearable()) diff --git a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs index d1e44ba5650..a60cb425a3b 100644 --- a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs +++ b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs @@ -99,6 +99,12 @@ public partial class AutoFill [Parameter] public float RowHeight { get; set; } = 50f; + /// + /// 失去焦点时判定输入框内容无效则清空内容 + /// + [Parameter] + public bool IsClearOnInvalid { get; set; } = false; + /// /// Gets or sets the overscan count for virtual scrolling. Default is 3. /// @@ -275,4 +281,35 @@ public async Task TriggerFilter(string val) } _dropdown.Render(); } + + + protected virtual async Task OnBlur() + { + if (IsClearOnInvalid) + { + // 获取input的实际值 + var inputValue = await GetInputValue(); + + if (!string.IsNullOrEmpty(inputValue)) + { + if (GetDisplayText(Value) != inputValue) + { + // 如果没有匹配项，清空输入和Model + CurrentValue = default; + await InvokeVoidAsync("setValue", Id, ""); + } + } + } + + + if (OnBlurAsync != null) + { + await OnBlurAsync(Value); + } + } + [JSInvokable] + public async Task GetInputValue() + { + return await InvokeAsync("getInputValue", Id); + } } From 7096dedee57f2ea0874a35f63dc25d514c5847d1 Mon Sep 17 00:00:00 2001 From: braia123 Date: Sat, 18 Oct 2025 20:34:49 +0800 Subject: [PATCH 2/6] Modify Enter key handling in AutoComplete component Signed-off-by: braia123 --- .../Components/AutoComplete/AutoComplete.razor.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js index 6cb13fcb597..a0d0654921d 100644 --- a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js +++ b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js @@ -150,7 +150,7 @@ export function init(id, invoke, value, changedEventCallback) { const handlerKeydown = (ac, e) => { const key = e.key; const { el, invoke, menu } = ac; - if (key === 'Enter' || key === 'NumpadEnter') { + if (key === 'Enter' ) { const skipEnter = el.getAttribute('data-bb-skip-enter') === 'true'; if (!skipEnter) { const items = [...menu.querySelectorAll('.dropdown-item')]; From cce633d1bceadfb4729f3e744d1e132dee507e99 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 19 Oct 2025 09:19:59 +0800 Subject: [PATCH 3/6] =?UTF-8?q?refactor:=20=E4=BB=A3=E7=A0=81=E9=87=8D?= =?UTF-8?q?=E6=9E=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../AutoComplete/AutoComplete.razor.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js index a0d0654921d..202e1359bcf 100644 --- a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js +++ b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js @@ -150,19 +150,19 @@ export function init(id, invoke, value, changedEventCallback) { const handlerKeydown = (ac, e) => { const key = e.key; const { el, invoke, menu } = ac; - if (key === 'Enter' ) { + if (key === 'Enter') { const skipEnter = el.getAttribute('data-bb-skip-enter') === 'true'; if (!skipEnter) { const items = [...menu.querySelectorAll('.dropdown-item')]; if (items.length === 1) { - // 当只有一个候选项时，直接触发点击 - items[0].click(); - invoke.invokeMethodAsync('EnterCallback'); - return; + const item = items[0]; + item.click(); } - const current = menu.querySelector('.active'); - if (current !== null) { - current.click(); + else { + const current = menu.querySelector('.active'); + if (current !== null) { + current.click(); + } } invoke.invokeMethodAsync('EnterCallback'); } From 81366c86dff168909c56c9c259098c899655e1fd Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 19 Oct 2025 09:20:39 +0800 Subject: [PATCH 4/6] =?UTF-8?q?refactor:=20=E7=A7=BB=E9=99=A4=20onblur=20?= =?UTF-8?q?=E5=9B=9E=E8=B0=83?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/AutoFill/AutoFill.razor | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor index 959f66e69c0..831284deed3 100644 --- a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor +++ b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor @@ -14,8 +14,7 @@ data-bb-auto-dropdown-focus="@ShowDropdownListOnFocusString" data-bb-debounce="@DurationString" data-bb-skip-esc="@SkipEscString" data-bb-skip-enter="@SkipEnterString" data-bb-scroll-behavior="@ScrollIntoViewBehaviorString" - placeholder="@PlaceHolder" disabled="@Disabled" - onblur="@OnBlur" /> + placeholder="@PlaceHolder" disabled="@Disabled" /> @if (GetClearable()) From e96725e5476dff6a945b1c758aaaf54ada1bbcff Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 19 Oct 2025 09:22:28 +0800 Subject: [PATCH 5/6] =?UTF-8?q?revert:=20=E6=92=A4=E9=94=80=E6=B8=85?= =?UTF-8?q?=E7=A9=BA=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/AutoFill/AutoFill.razor.cs | 37 ------------------- 1 file changed, 37 deletions(-) diff --git a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs index a60cb425a3b..d1e44ba5650 100644 --- a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs +++ b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs @@ -99,12 +99,6 @@ public partial class AutoFill [Parameter] public float RowHeight { get; set; } = 50f; - /// - /// 失去焦点时判定输入框内容无效则清空内容 - /// - [Parameter] - public bool IsClearOnInvalid { get; set; } = false; - /// /// Gets or sets the overscan count for virtual scrolling. Default is 3. /// @@ -281,35 +275,4 @@ public async Task TriggerFilter(string val) } _dropdown.Render(); } - - - protected virtual async Task OnBlur() - { - if (IsClearOnInvalid) - { - // 获取input的实际值 - var inputValue = await GetInputValue(); - - if (!string.IsNullOrEmpty(inputValue)) - { - if (GetDisplayText(Value) != inputValue) - { - // 如果没有匹配项，清空输入和Model - CurrentValue = default; - await InvokeVoidAsync("setValue", Id, ""); - } - } - } - - - if (OnBlurAsync != null) - { - await OnBlurAsync(Value); - } - } - [JSInvokable] - public async Task GetInputValue() - { - return await InvokeAsync("getInputValue", Id); - } } From 064439768e307f5363f6fcd0333fa962007eefa3 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 19 Oct 2025 09:23:27 +0800 Subject: [PATCH 6/6] =?UTF-8?q?revert:=20=E6=92=A4=E9=94=80=20js=20?= =?UTF-8?q?=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/AutoComplete/AutoComplete.razor.js | 8 -------- 1 file changed, 8 deletions(-) diff --git a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js index 202e1359bcf..65edd05a49f 100644 --- a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js +++ b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js @@ -234,11 +234,3 @@ const scrollIntoView = (el, item) => { } export { handleKeyUp, select, selectAllByFocus, selectAllByEnter } - -export function getInputValue(id) { - const ac = Data.get(id); - if (ac && ac.input) { - return ac.input.value; - } - return ""; -}