Radzen Textbox with multi string chips

Radzen.Blazor Components
2

Hi @Hunain_Nasir,

Your code doesn't work as the value of RadzenTextbox is updated when the user blurs it (it loses focus). As a result VariationValue is always null in VariationValuesChangeHandler

You can change your code like this so it uses JS interop to get the value and set it back:

    private async Task VariationValuesChangeHandler(KeyboardEventArgs keypress)
    {
        if (keypress.Key != "Enter" && keypress.Key != "Tab") return;
        else
        {
            // Get the value via JS interop
            var value = await JSRuntime.InvokeAsync<string>("eval", $"document.getElementById('Variation_Value_Input').value");
        
            val.Add(value);

            // Set the value 
            await JSRuntime.InvokeVoidAsync("eval", $"document.getElementById('Variation_Value_Input').value = ''");
        }
    }

Make sure you inject the JSRuntime:

@inject IJSRuntime JSRuntime

chips

1 Like