If user input should control which pointers that are visible as in this example:

@page "/gauge"

<div>
    <TelerikCheckBox Id="display_second" @bind-Value=_displaySecond></TelerikCheckBox>
    <label for="display_second">Display second pointer</label>
</div>

<TelerikRadialGauge>
    <RadialGaugePointers>
        <RadialGaugePointer Value="55" />
        
        @if (_displaySecond)
        {
            <RadialGaugePointer Value="75" Color="red" />
        }
    </RadialGaugePointers>
</TelerikRadialGauge>

@code {
    bool _displaySecond;
}

The size of the RadialGauge is not set correctly if changing properties from user input.

@page "/gauge"

<div>
    <TelerikCheckBox Id="large" @bind-Value=_large ></TelerikCheckBox>
    <label for="large">Large</label>
</div>


<TelerikRadialGauge Width=@(_large ? "500px" : "200px") Height=@(_large ? "500px" : "200px")>
    <RadialGaugePointers>
        <RadialGaugePointer Value="55" />
    </RadialGaugePointers>
</TelerikRadialGauge>

@code {
    bool _large;
}

Nothing happens with the gauge in the example above, I would expect it to be larger when ticking the checkbox.

If using F12 in the browser I can see that the outer element get the correct size, but not the inner svg...

Issue: Opening and closing a window will cause the window to reopen with each following OnClick. This seems to have been introduced with the upgrade to .net10

Code: Below is an example used on the basic Telerik Blazor template. Copy this and replace Home.razor with it.

@page "/"

<PageTitle>Telerik Blazor App | Home</PageTitle>

<div id="home-page">
    <HomeSvg />

    <h1>Hello, Telerik UI for Blazor!</h1>

    <p>Welcome to your new Telerik Blazor app.</p>

    <TelerikButton OnClick="OpenWindow1">Click Here First</TelerikButton>
    <TelerikButton OnClick="OpenWindow2">Click Here Second</TelerikButton>
    <TelerikButton OnClick="@(async () => {await Task.Delay(100);})">Unrelated OnClick</TelerikButton>


</div>

<TelerikWindow Visible="ShowWindow1">
    <WindowActions>
        <WindowAction OnClick="CloseWindow1" Name="Close"></WindowAction>
    </WindowActions>
    <WindowContent>
        <span>Moving window now will help find this window in next step, but not necessary to replicate bug.</span>
        <br />
        <span>Close window using 'X'.</span>
    </WindowContent>
</TelerikWindow>

<TelerikWindow Visible="ShowWindow2">
    <WindowActions>
        <WindowAction OnClick="CloseWindow2" Name="Close"></WindowAction>
    </WindowActions>
    <WindowContent>
        <span>Window 1 shouldn't be appearing now, but it it is. Window 1 may be behind this window if you didn't drag in previous step.</span>
        <br />
        <span>If you close these windows, and click the 'Unrelated OnClick' button, both of these windows will reappear, despite just firing Task.Delay(100)</span>
    </WindowContent>
</TelerikWindow>

<style>
    #home-page {
        margin-left: auto;
        margin-right: auto;
        max-width: max-content;
        text-align: center;
        font-size: var(--kendo-font-size-xl);
    }

    @@media (min-height: calc(56px + 50px + 400px)) {
        /* header + footer + home page container*/
        #home-page {
            margin-top: calc(50vh - 28px - 25px - 200px);
        }
    }
</style>

@code {
    public bool ShowWindow1 { get; set; }
    public bool ShowWindow2 { get; set; }

    public async Task OpenWindow1()
    {
        ShowWindow1 = true;
    }

    public async Task OpenWindow2()
    {
        ShowWindow2 = true;
    }

    public void CloseWindow1()
    {
        ShowWindow2 = false;
        StateHasChanged();
    }

    public void CloseWindow2()
    {
        ShowWindow2 = false;
    }
}

Hi, 

   I have a new laptop with a fresh install of visual studio and telerik etc etc.  When I went to get the ai coding assistants to work, nothing I did worked.  Spent hours trying to figure it out when Claude suggested I install NODE.  After I did that, and went the the telerik blazor extension to "Configure MCP server globally" the ai worked.

   First, have the configuration check to see if node is working and installed and give a warning if it is not, or let people know that it needs to be installed to make it work.  Secondly, add this to the documentation.  Such a pain in the ass when the documentation isn't complete.  The amount of time i spent on this is stupid compared to how simple the solution was.

Peter

Hello

I notice that zoom on chart with numeric values make the axis values with a lot of decimal and didn't find a way to round them.

We can see it directly in the documentation here

Is there a way to keep the axis to rounded value ?

Thank you
Regards,
Thomas

The TelerikPanelBar component is using Right and Left arrows on keyboard to opening and closing each tab. 
https://demos.telerik.com/blazor-ui/panelbar/keyboard-navigation

When the page is zoomed to 200%, it gets a horizontal scrollbar, which is normally controlled with the left and right arrow keys on keyboard. However, these keys are assigned to opening and closing the TelerikPanelBar component, which makes it impossible to scroll the page horizontally while we have Tab on TelerikPanelBar. Is there any workaround that would allow horizontal scrolling with the left and right arrow keys on keyboard at this zoom level? Maybe it’s possible to change TelerikPanelBar behavior and opening and closing it by different keys?

When a TelerikComboBox is defined inside a window and the ContainmentSelector attribute is set for that window, the ComboBox exhibits erratic behavior: it sometimes fails to open, and selections from the dropdown may not register. Overall, the ComboBox does not function reliably in this configuration.

See attached video for current behavior.

If the ContainmentSelector attribute is removed, TelerikComboBox works as expected.

See attached example to reproduce the issue.

The latest version has broken one of our projects due to; 

• Throw when using Data and OnRead for the same component

So we deliberately used both events which worked quite well (but is now disallowed);

<TelerikGrid Data="@SheetList"
     @ref="_grid"
     SelectionMode="@GridSelectionMode.Multiple"
     @bind-SelectedItems="@SelectedSheets"
     EditMode="GridEditMode.Inline"
     OnRowContextMenu="@OnContextMenu"
     OnRowClick="@OnRowClick"
     OnAdd="OnAddHandler"
     OnEdit="@OnEditHandler"
     OnUpdate="OnUpdateHandler"
     OnCreate="OnCreateHandler"
     OnDelete="OnDeleteHandler"
     OnRead="@(IsFromHierarchy ? null : OnReadItemsAsync)"

This pattern enabled us to create components that did EITHER server-side pagination, or if it was send a data list as a parameter from a parent component, then it would use that instead (and turn off server pagination).

What would now be the recommended pattern for this scenario? Or do we need to duplicate the whole grid in the component (which isnt ideal).

Hello,

 it seems that something is missing to get it working in "SpeecToTextButton". 

how to reproduce:

• tested in different browser(edge,vivaldi,ff), even in private mode https://www.telerik.com/blazor-ui/documentation/components/speechtotextbutton/integration
• load the page

1. click start recording
2. allow microphone access for the first time
3. nothing recorded(it stays max at 2secs in recording state), goto 1

it flickers for a while(at system taskbar, there is also indication of recording) but nothing is "recorded/transcribed".

Is there any additional setup at clientside?

Hello,

I am experiencing a crash when trying to remove a FilterField from a TelerikFilter component when using it inside a TelerikDialog. From what I understand, the documentation for the TelerikFilter is out of date ('TelerikFilter.ValueChanged' is obsolete: 'Use OnUpdate instead.') so I did my best trying to put the piece together.

The TelerikFilter code is based on the updated Telerik sample provided here: 'TelerikFilter.ValueChanged' is obsolete: 'Use OnUpdate instead.' but updated based on the documentation for "Filter in a Dialog" provided here: Blazor Dialog Integration - Telerik UI for Blazor

Here is my code:

 <TelerikDialog @ref="@DialogRef" Visible="@ShowDialog" Width="600px" Title="My Dialog" VisibleChanged="@WindowVisibilityChangeHandler">
     <DialogContent>
         <TelerikFilter Value="@Value" OnUpdate="@((value) => OnFilterUpdate(value))">
             <FilterFields>
                 <FilterField Name="@(nameof(Person.EmployeeId))" Type="@(typeof(int))" Label="Id"></FilterField>
                 <FilterField Name="@(nameof(Person.Name))" Type="@(typeof(string))" Label="First Name"></FilterField>
                 <FilterField Name="@(nameof(Person.AgeInYears))" Type="@(typeof(int))" Label="Age"></FilterField>
             </FilterFields>
         </TelerikFilter>
   </DialogContent>
   <DialogButtons>
    <TelerikButton OnClick="@(() => ResetDialogState())">Cancel</TelerikButton>
    <TelerikButton ThemeColor="@(ThemeConstants.Button.ThemeColor.Primary)" OnClick="@(() => PrimaryAction())">Confirm</TelerikButton>
</DialogButtons>
</TelerikDialog>

@code {
private CompositeFilterDescriptor Value { get; set; } = new CompositeFilterDescriptor();

private void OnFilterUpdate(object filter)
{
    if (filter is null)
    {
        return;
    }
    Value = (CompositeFilterDescriptor)filter;
    DialogRef.Refresh();
}

public class Person
{
    public int EmployeeId { get; set; }
    public string Name { get; set; } = string.Empty;
    public int AgeInYears { get; set; }
}
}

The TelerikFilter renders fine and I can add Filters by clicking the "Add Expression" button. However, when I try to remove a filter that was added, I click on the X button on the right. The first time, nothing happens. When I click a second time, I get this error:

 Unhandled exception rendering component: Index was out of range. Must be non-negative and less than the size of the collection. (Parameter 'index')
      System.ArgumentOutOfRangeException: Index was out of range. Must be non-negative and less than the size of the collection. (Parameter 'index')
         at System.Collections.ObjectModel.Collection`1.RemoveAt(Int32 index)
         at Telerik.Blazor.Components.Filter.FilterGroup.OnFilterRemove(Int32 index, String removedFilterId)
         at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task)
         at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

I also have attached a video of the issue to this ticket.

Is this a bug? If not, can you point me in the right direction?
Thanks,

Mathieu

Hi Telerik Team!

We’ve noticed that your official website uses anchor scrolling (clicking on links to scroll to specific sections smoothly), and we’d love to see that as a Telerik Blazor component.

This would be super useful in scenarios where:

• The only way to present content is via long scrollable pages

• Tabs aren’t a good UX fit

What we’re looking for:

-Smooth scrolling to internal page anchors (sections)

-Scrollspy-like feature to highlight active section

-Optional scroll offset for sticky headers

-Lightweight, flexible integration (with or without Telerik Form/Layout components)

We feel this would be a great addition to the Telerik Blazor suite — especially for documentation-style pages, long forms, or configuration panels.

Thanks a lot and keep up the awesome work!

Best regards,
Bohdan

In the TelerikSignature control, the ExportScale property defaults to 2.  This causes the image size to be doubled without realizing it. While it can be useful to scale the exported image, the default should be 1, because that is the expected default output.

<TelerikSignature @bind-Value="Medlog.Signature" Width="700px" Height="120px" Smooth="true" StrokeWidth="2" PopupScale="2" ExportScale="1">
</TelerikSignature>

Context

The website uses OAuth2 (AzureAd) & https with http version 1 :

"Kestrel": {
"EndpointDefaults": {
"Protocols": "Http1"
}

Glitch

Crash systematically reproduced when user opens website.

Workaround

The issue can be can be manually & individually (per user) fixed by:

• Executing the instruction: Navigation.NavigateTo($"MicrosoftIdentity/Account/SignOut", true);
• Closing Edge browser
• Opening back website
• Answering OAuth 2 challenge (MicrosoftIdentity/Account/SignIn)

Our client is pushing hard for us to find an automatic solution / patch (which doesn't involve making multiple actions for his users like in my workaround).

Hello,

I am currently reworking an old webapp with server-side Blazor and Telerik UI for Blazor. I noticed that TelerikDialogs kind of break the rerendering of child components if the TelerikDialog and all of its content are placed inside their own component:

<PageTitle>Home</PageTitle>

<EditWithDialog @ref="EditDialogInside"></EditWithDialog>

Where EditWithDialog is (basically) defined as follows:

<TelerikDialog @ref="Dialog" @bind-Visible="@Visible">
	<DialogTitle>
		Edit ID
	</DialogTitle>
	<DialogContent>
		<div>
			<div>TelerikDialog inside of component</div>
			<TelerikTextBox Value="@AppState.CustomerString" OnChange="@SetID" Width="300px"></TelerikTextBox>
			<TelerikButton OnClick="@GenerateID">Generate ID</TelerikButton>
		</div>
	</DialogContent>
	<DialogButtons>
		<TelerikButton OnClick="@ToggleVisible">Close</TelerikButton>
	</DialogButtons>
</TelerikDialog>

However, if the TelerikDialog is placed on a page and its content is placed inside of its own component, everything works as expected:

<PageTitle>Home</PageTitle>
<TelerikDialog @bind-Visible="@Visible">
	<DialogTitle>
		Edit ID
	</DialogTitle>
	<DialogContent>
		<div>
			<div>TelerikDialog outside of component</div>
			<EditWithoutDialog @ref="EditDialogOutside"></EditWithoutDialog>
		</div>
	</DialogContent>
	<DialogButtons>
		<TelerikButton OnClick="@ToggleEditOutside">Close</TelerikButton>
	</DialogButtons>
</TelerikDialog>

EditWithoutDialog.razor:

<TelerikTextBox Value="@AppState.CustomerString" OnChange="@SetID" Width="300px"></TelerikTextBox>
<TelerikButton OnClick="@GenerateID">Generate ID</TelerikButton>

I am using the state-container approach described here, but the problem persists when using two-way binding via parameters.

In this scenario, putting the dialog directly on the page is not a problem, but with larger applications where there's possibly multiple dialogs and a lot more content on one page, this can become very unwieldy and confusing. Considering Blazors emphasis on making components reusable, this also prevents proper use of a customized dialog component that uses the TelerikDialog as a base.

I have attached a small project that implements both versions on a single page for you to test. I have tested using both Edge and Firefox.

Hi there,

I have a TelerikGrid with a DateTime column. I use a custom FilterEditorFormat which is localizable depending on the user settings, e.g. "dd/MM/yyy HH:mm:ss". Unfortunately, any '/' in the date component is always replaced by the current culture's DateSeparator. Using any other separator works, e.g. '-'. 

Expectation: Use the FilterEditorFormat without modification, unless it's a standard format string like "g" or "D".

I already traced it down to Telerik's FormatHelper class and it seems like a quick fix.

Steps to reproduce:

• Create a TelerikGrid with a DateTime column and a FilterEditorFormat as shown above.
• If required, change the DateSeparator to anything else but '/'.
• Run and open the filter dialog

Please let me know if you need any additional information.

Best regards

Andreas