Completed
Last Updated: 14 Nov 2024 09:29 by ADMIN
Release 7.0.0
Shawn
Created on: 17 Oct 2024 14:31
Category: MultiSelect
Type: Bug Report
1
OnBlur event inconsistency between Single and Multiple TagMode

The OnBlur event does not fire after removing an item wehn using TagMode="@MultiSelectTagMode.Single"

I used this snippet in the Blazor REPL to reproduce the issue:


<p>@OnBlurMessage</p>
<TelerikMultiSelect Data="@Countries"
                    @bind-Value="@SelectedCountries"
                    TagMode="@MultiSelectTagMode.Single"
                    Placeholder="Enter Balkan country, e.g., Bulgaria"
                    Width="350px" 
                    ClearButton="true"
                    AutoClose="false"
                    OnBlur="OnBlurHandler">
</TelerikMultiSelect>

@code {
    private List<string> Countries { get; set; } = new List<string>();

    private List<string> SelectedCountries { get; set; } = new List<string>();
    string OnBlurMessage {get; set;} = "";
    int i;

    protected override void OnInitialized()
    {
        Countries.Add("Albania");
        Countries.Add("Bosnia & Herzegovina");
        Countries.Add("Bulgaria");
        Countries.Add("Croatia");
        Countries.Add("Kosovo");
        Countries.Add("North Macedonia");
        Countries.Add("Montenegro");
        Countries.Add("Serbia");
        Countries.Add("Slovenia");
        base.OnInitialized();
    }

    void OnBlurHandler()
    {
        OnBlurMessage = $"OnBlurHandler touched {++i} times";
    }
}

Steps to reproduce:

  1. Select an item from the list then click out of the control.  Note that the comments shows "OnBlurHandler touched 1 times".
  2. Click the x for the "1 item(s) selected" tag then click outside of the control.  Note that the comment still shows "OnBlurHander touched 1 times".
  3. Click into the control then outside of control.  Note that the comment is updated to show "OnBlurHandler touched 2 times".

The OnBlur event should fire after step 2.

Attached is a short video clip of what I see.

4 comments
ADMIN
Hristian Stefanov
Posted on: 30 Oct 2024 11:32

Hi Shawn,

After a thorough investigation, I can confirm that this is indeed a bug in the MultiSelect component. It reflects an inconsistency in how the OnBlur event behaves between Single mode and Multiple Tag mode.

Thus, I'm marking this item as Unplanned.

Regards,
Hristian Stefanov
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Shawn
Posted on: 23 Oct 2024 12:34
Hristian acknowledged in support ticket 1667428 that he was able to reproduce this by following the steps above, so I'm hoping to see this changed to Unplanned soon.
ADMIN
Hristian Stefanov
Posted on: 21 Oct 2024 14:51

Hi Shawn,

I'm marking this public item as "Declined" since the OnBlur event behaves as expected in "Single" tag mode—firing each time the input box loses focus.

Based on the steps provided, the input lost focus twice, which correctly caused the event to fire twice. The OnBlur event is not intended to fire after the removal of an item, but rather when focus is lost.

Regards,
Hristian Stefanov
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Shawn
Posted on: 17 Oct 2024 14:38
BTW - It works as expected the MultiTagMode.Multiple is used.