Telerik Forums
UI for Blazor Forum
1 answer
26 views
I have a spreadsheet component with some other text boxes and such above it and the user is most likely to start by entering data in the stuff above before entering spreadsheet data but what happens is that when the screen loads the user can start typing into the boxes above and as they are typing the spreadsheet will complete its loading (since that take a little longer) and steal the focus and then all of a sudden the user is now unexpectedly typing in the spreadsheet. The AI tools have exhausted all options to combat this and have told me to just live with it but that's not ideal. Is there a workaround?
Ivan Danchev
Telerik team
 answered on 26 Feb 2026
1 answer
26 views

I'm using the built in form in my TelerikGrid with the EditMode="GridEditMode.Popup".  I have not customized it at all.  It works great.  However, the Evinced tool was run against it for accessibility and the field is missing an accessible name.  Is there a way to add something to the gridcolumn to give it that info. in the popup form?  Or do I have to create a custom edit form for my 1 column/field to be edited?

Here's my grid in .NET10.

<TelerikGrid Data="@fictitiousNames"
             Width="800px"
             Class="z-index-1"
             Sortable="true"
             EditMode="GridEditMode.Popup"
             OnUpdate="@UpdateFictitiousName"
             OnCreate="@AddFictitiousName"
             OnEdit="@OnFictitiousNameEdit"
             OnDelete="@DeleteFictitiousName">
    <GridToolBarTemplate>
        <GridCommandButton Command="Add"
                           Icon="@SvgIcon.Plus"
                           Class="k-button-sm"
                           OnClick="@(_ => { FictitiousNameTitle = "New Fictitious Name"; })">Add Fictitious Name</GridCommandButton>
    </GridToolBarTemplate>
    <GridSettings>
        <GridPopupEditSettings Width="400px"
                               Height="400px"
                               Title="@FictitiousNameTitle">
        </GridPopupEditSettings>
        <GridPopupEditFormSettings>
            <ButtonsTemplate>
                @{
                    <GridCommandButton Command="Save" Icon="@SvgIcon.Save" class="k-button-sm k-button-solid-primary">
                        @if (context.IsNew)
                        {
                            <span>Save</span>
                        }
                        else
                        {
                            <span>Update</span>
                        }
                    </GridCommandButton>
                    <GridCommandButton Command="Cancel" Icon="@SvgIcon.Cancel" class="k-button-sm k-button-solid-primary">
                        <span>Cancel</span>
                    </GridCommandButton>
                }
            </ButtonsTemplate>
        </GridPopupEditFormSettings>
    </GridSettings>
    <GridColumns>
        <GridColumn Field="@(nameof(FictitiousNameDto.FictitiousName))" Title="Name" Width="60px" />
        <GridCommandColumn Width="20px">
            <GridCommandButton Command="Edit" Icon="@SvgIcon.Pencil">Edit</GridCommandButton>
            <GridCommandButton Command="Delete" Icon="@SvgIcon.Trash">Delete</GridCommandButton>
        </GridCommandColumn>
    </GridColumns>
</TelerikGrid>
Hristian Stefanov
Telerik team
 answered on 25 Feb 2026
1 answer
67 views

https://www.telerik.com/support/whats-new/blazor-ui/release-history/telerik-ui-for-blazor-13-0-0-(2026-q1)

Hate to be harsh since you folks are very supportive, but the list above hardly worthy of a new major version jump.  Is this a sign that Telerik is moving away from Microsoft's beloved Blazor technology?  Not enough developers using Blazor?

It's certainly concerning.  I know Blazor has it's ups and downs, but Microsoft have committed to it long term (unlike Silverlight and UWP and other technologies they've quickly abandoned) and a lot of the .NET 10/11 features are aimed at Blazor improvements.

Features that are very frequently being used like DialogFactory remain untouched an visually look like they came from circa 2010 not 2026.  Clicking on a button outside a Grid and the pending cell data is lost ... kinda important to fix?

Can you folks comment on what is going on here as it looks like not much attention/resources are being put into Blazor?

Dimo
Telerik team
 updated question on 19 Feb 2026
4 answers
186 views

Hey,

I am working on a Telerik for Blazor UI project and I'm really liking alll the Telerik features so far. However, when there are too many data points on my graph, the x axis becomes really hard to read, so I added a feature to scale the number of visible x-axis categories based on the number of intervals.

For this purpose, I was hoping to add a feature so that when one zooms into the graph, more of the x-axis intervals become visible based on how many can comfortably fit on screen. To this end, I need to know how much a user has zoomed in so that I can scale things accordingly. However, from all I can find online, there is no way to query a TelerikChart for how zoomed in you are. I might be missing something, but in case I am not, I think this feature could be very helpful so that one can add events based on the zoom in and have things change accordingly.

Thanks

Peter
Top achievements
Rank 2
Iron
Iron
Veteran
 updated answer on 18 Feb 2026
1 answer
33 views

Objective: show different color (say Green Text) for any grid cell the user has modified in "real-time" (as the user navigates cell to cell in the grid).

I can get the field name from the OnUpdate event:

var nameOfField = args.Field;

But this isn't of much use in that event handler.  I set the model property "WasEdited" to true:

item.WasEdited = true;
 

The OnCellRender fires but for every column that is editable ... so rather than having a single cell's text color change ALL cells set as Editable will have their color changed.  So I created a unique OnCellRender handler for each column/field/cell that can be edited (Editable=true):

    void OnFirstIncrementDaysNextCellRender(GridCellRenderEventArgs args)
    {
        RateCyItem item = (RateCyItem)args.Item;
        if (item.HasFutureRate)
        {
            args.Class = "futureRate";
        }

        if (item.WasEdited)
        {
            args.Class = "editedCell";
            item.WasEdited = false;
        }

    }

    void OnFirstIncrementRateNextCellRender(GridCellRenderEventArgs args)
    {
        RateCyItem item = (RateCyItem)args.Item;
        if (item.HasFutureRate)
        {
            args.Class = "futureRate";
        }

        if (item.WasEdited)
        {
            args.Class = "editedCell";
            item.WasEdited = false;
        }

    }

    void OnSecondIncrementRateNextCellRender(GridCellRenderEventArgs args)
    {
        RateCyItem item = (RateCyItem)args.Item;
        if (item.HasFutureRate)
        {
            args.Class = "futureRate";
        }

        if (item.WasEdited)
        {
            args.Class = "editedCell";
            item.WasEdited = false;
        }

    }

However, this doesn't work?  I trace thru the code and single per field/colum onCellRender is fired once (an only once) as expected for the appropriate event.   However, the cell text color doesn't change?  If I remove item.WasEdited = false (basically don't reset model was edited state).

    void OnFirstIncrementDaysNextCellRender(GridCellRenderEventArgs args)
    {
        RateCyItem item = (RateCyItem)args.Item;
        if (item.HasFutureRate)
        {
            args.Class = "futureRate";
        }

        if (item.WasEdited)
        {
            args.Class = "editedCell";
        }

    }

    void OnFirstIncrementRateNextCellRender(GridCellRenderEventArgs args)
    {
        RateCyItem item = (RateCyItem)args.Item;
        if (item.HasFutureRate)
        {
            args.Class = "futureRate";
        }

        if (item.WasEdited)
        {
            args.Class = "editedCell";
        }

    }

    void OnSecondIncrementRateNextCellRender(GridCellRenderEventArgs args)
    {
        RateCyItem item = (RateCyItem)args.Item;
        if (item.HasFutureRate)
        {
            args.Class = "futureRate";
        }

        if (item.WasEdited)
        {
            args.Class = "editedCell";
        }

    }

Then ALL 3 cells render green text, rather than just the one cell ... this is not what I want.  I don't understand why this is happening since the other OnCellRender events are NOT being called (verified with breakpoint), just the single OnCellRender event that should update the cell color for just that one cell (NOT all cells).

It looks to me like there is some issue with Grid cell render where setting the args.Class in a OnCellRender gets applied to ALL editable cells rather than the single cell?

Is this a bug or am I missing something?

Rob.

Dimo
Telerik team
 answered on 16 Feb 2026
2 answers
173 views
Any ideas on how I can get the Badge to pop beyond the constraints of its host/parent?  Or, can I put the badge to the upper-middle left so it fits better inside the container?




        <TelerikAppBar Class="gsi-background-color">
            <AppBarSection>
                <NavLink href="@ProfileService.HomeUrl" class="gsi-navlink gsi-padding-10 gsi-padding-10-top-bottom">
                    Home
                </NavLink>
            </AppBarSection>

            <AppBarSection>
                <NavLink href="@AboutUrl" class="gsi-navlink gsi-padding-10 gsi-padding-10-top-bottom">
                    About
                </NavLink>
            </AppBarSection>

            <AppBarSpacer />

            <AppBarSection>
                <div class="input-group">

                    @if (ProfileService.IsNotNull())
                    {
                        if (ProfileService.IsInRole(SecurityRoles.Admin, Direction.Up))
                        {
                            <TelerikButton OnClick="OnRouteToNotifications" Class="gsi-button-icon-32">
                                <img src="/images/32/Nofications.white.32x32.png" height="32" width="32" />
                                @if (MessageCount > 0)
                                {
                                    <TelerikBadge VerticalAlign="@BadgeVerticalAlign.Top"
                                                  Class="gsi-background-color-darkgray gsi-color-white">
                                        @MessageCount
                                    </TelerikBadge>
                                }
                            </TelerikButton>

                            <TelerikButton OnClick="@OnRouteToProfile" Class="gsi-button-icon-32">
                                <img src="/images/32/PersonV2.png" height="32" width="32" />
                            </TelerikButton>

                            <NavLink href="@UserDetailsUrl" class="gsi-navlink gsi-padding-10-top-bottom gsi-cursor-pointer">
                                @UserDisplayName
                            </NavLink>

Joel
Top achievements
Rank 3
Bronze
Bronze
Bronze
 answered on 13 Feb 2026
0 answers
33 views

I have a 5 high x 3 Wide Telerik Tile Layout. On the top row, I have RowSpan 2 and ColSpan 1 and it works perfectly fine to show 3 cards.

There are 3 remaining cards that I want to show below those. The first one will have a Rowspan of 3 and a ColSpan of 2. Next to that, in the row on the far right, I am specifying a RowSpan of 3 and a ColSpan of 1 and it will only render as a size of RowSpan 1. It is way too short.

So the content within the card is cut off. The content is a card and within the card is a telerik grid. We can only see the grid header and the first 2 rows. We cannot see the remaining rows or the page number controls for the grid. 

If I set the RowSpan of this card to 4 or greater, it will expand and the card extends below the card to it's left. It is way too tall.

How can I solve this issue? And why is it only a size of 1 RowSpan when I explicitly set it to 3?

David
Top achievements
Rank 1
 asked on 12 Feb 2026
1 answer
36 views

Hello,

Is there a way to show in a Dialog an html formated message ?
I would like to be able to do for instance something like this :

var value = await TelerikDialogs.PromptAsync(
                            new MarkupString($"<p>Please choose :</p><p>1) Value 1</p><p>2)...</p>",
                            "Pick an item",
                            "1"
                        );

And the same shall apply to AlertAsync() and ConfirmAsync() I guess.

Many thanks in advance !

Franck

Dimo
Telerik team
 answered on 10 Feb 2026
1 answer
36 views
I am attempting to utilize the OnChange and OnBlur events to handle when the enter button is pressed on an input (TelerikTextBox). I can get it to work quite easily, however, I do not want the OnBlur functionality at all. The more irritating part is that the OnChange event is fired by both the enter button, and the OnBlur event. Even when I change the OnBlur event to do nothing, the OnChange event still fires when we lose focus on the component. I only want the enter button presses to fire the OnChange event. Am I doing this wrong? Is there another method to this? Here is what I have so far:


                                            <TelerikTextBox Value="@_scanSlotInput"
                                                            OnChange="@SubmitScanSlot"
                                                            OnBlur="@HandleBlur"
                                                            ValueChanged="@((string v) => { _scanSlotInput = (v).ToUpperInvariant(); StateHasChanged(); })"
                                                            Placeholder="Scan or enter Slot QR"
                                                            Enabled="@(!_isSessionEnded)">
                                                <TextBoxPrefixTemplate>
                                                    <TelerikButton OnClick="@StartScanSlotQr" Enabled="@(!_isSessionEnded)" FillMode="@ThemeConstants.Button.FillMode.Clear">
                                                        <span class="fa-duotone fa-solid fa-camera-viewfinder" style="color: var(--kendo-color-primary, #0056b3);"></span>
                                                    </TelerikButton>
                                                </TextBoxPrefixTemplate>
                                                <TextBoxSuffixTemplate>
                                                    <TelerikButton OnClick="@(() => { _ignoreNextChange = false; return SubmitScanSlot(); })" Enabled="@(!_isSessionEnded)" FillMode="@ThemeConstants.Button.FillMode.Clear">
                                                        <span class="fa-duotone fa-solid fa-circle-check" style="color: var(--kendo-color-success, #28a745);"></span>
                                                    </TelerikButton>
                                                </TextBoxSuffixTemplate>
                                            </TelerikTextBox>


    private bool _ignoreNextChange;

    private async Task HandleBlur()
    {
        _ignoreNextChange = true;
        await Task.Delay(300);
        _ignoreNextChange = false;
    }

The @SubmitScanSlot function is excluded because it has "if (_ignoreNextChange) return;" and then goes into the rest of the function and is not relevant to this issue.

I saw the knowledge base article on the OnChange event firing twice and tried utilizing that, but the problem is not validating whether or not the value in the text box has changed, but to ignore the OnBlur completely and only allow the enter key to fire the event.
Dimo
Telerik team
 answered on 10 Feb 2026
1 answer
35 views

I have a simple grid with a list object, where one property is a date and the other a string. The grid is sorted on dates. I want to insert a custom <tr> row before the "normal" row if the month changes, containing a single <td> cell with the year and month.

I've looked at the <RowTemplate> but if I try to insert a <tr> in there, the whole table is broken because the rowtemplate should not (as I understand it) not contain a tr but only td cells.

Anyone?

Dimo
Telerik team
 answered on 09 Feb 2026
Narrow your results
Selected tags
Tags
+? more
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?