How do I use ChartSeriesLabelsPadding, it seems to describe the exact behaviour I want in a chart, but I can't find any implementation details or examples of how it should be used anywhere.

I have a series of charts where the largest data points are just at the top of the chart and the tooltip will appear just above the top and get cut off and only the bottom of the text is visible. 

Help would be greatly appreciated.

Thanks,

Hunter

In an editable grid, is there some way to identify cells that have been edited from their original values? In this case, I'm looking to style them differently to make it visibly apparent that they are "dirty".

We have a solution that is functional but cumbersome. Within each record, we maintain a list of dirty fields it contains (updated in the OnUpdate handler). Then we assign an OnCellRender handler to every column which adds a "changed-cell" class conditionally if that field on that record is dirty. It's a pain adding this OnCellRender handler to everything; I would rather it be automatic.

Does something exist that would allow me to easily accomplish this? If not, would a feature request be possible to automatically add a class to a cell when it is changed? Thanks.

Greetings,

When adding the TelerikRootComponent to the MainLayout.razor, the App.razor is initialized multiple times.  If I remove the TelerikRootComponent, then App.razor is initialized once as expected.

The problem is within App.razor, we use the NavigationManager to navigate to a login endpoint when a user is not authorized.  The navigation now gets triggered multiple times before actually completing.  What change do I need to make in order to have the App.razor initialize once while still using TelerikRootComponent?

I followed the guide wrapping @Body with TelerikRootComponent and then tried creating the TelerikLayout which had the same result.  This is in a .NET 7 Blazor Server app.  Thanks in advance for the help.

Hey,

I'm trying to build an edit screen for some rather complicated data. The data is complicated enough that putting the entire form on one page is quite unwieldy, so I decided to move parts of it to different tabs. Easier said than done apparently, because I'm running into an issue.

It looks like there is an issue when nesting FormItems within a TabStripTab. Here's a code sample to reproduce the issue;

<TelerikForm Model="@_model" OnValidSubmit="HandleValidSubmit">
    <FormItems>
        <TelerikTabStrip PersistTabContent="true">
            <TabStripTab Title="Tab 1">
                <FormItem Field="@nameof(_model.GenericLvl1)" LabelText="Generic lvl 1" />
            </TabStripTab>
            <TabStripTab Title="Tab 2">
                <FormItem Field="@nameof(_model.GenericLvl2)" LabelText="Generic lvl 2" />
                <FormItem Field="@nameof(_model.GenericLvl3)" LabelText="Generic lvl 3" />
            </TabStripTab>
        </TelerikTabStrip>
    </FormItems>
    <FormButtons>
        <TelerikButton ButtonType="ButtonType.Submit" ThemeColor="primary">Submit</TelerikButton>
        <TelerikButton ButtonType="ButtonType.Button" OnClick="Cancel">Cancel</TelerikButton>
    </FormButtons>
</TelerikForm>

When executed, this sample will render the following;

It appears the Generic lvl 2 field is being rendered outside of the TabStripTab. The tab itself appears empty, with the form fields it's supposed to contain appearing underneath it.

Clicking on Tab 2 then causes the fields it's supposed to contain to be placed underneath the field from Tab 1;

The fields from Tab 2 don't disappear when you click on Tab 1; they will stick around until the page is refreshed. This doesn't happen when PersistTabContent is disabled; the fields will still appear to be outside of the tab, but they do disappear when the tab is closed.

From my testing it seems that the moment a component is wrapped within a FormItem, it will be rendered outside of the tab it's supposed to be in. As another example, given this tab;

<TabStripTab Title="Tab 1">
    <FormItem>
        <Template>
            <TelerikTextBox @bind-Value=_model.GenericLvl1 Placeholder="Within FormItem"/>
        </Template>
    </FormItem>
    <TelerikTextBox @bind-Value=_model.GenericLvl2 Placeholder="Outside FormItem"/>
</TabStripTab>

I would expect both text boxes to appear in order and to be visually identical (except for the placeholder text). What actually happens is this;

It's admittedly been a few years since I last worked with Blazor and I've never used the Telerik UI components before, so perhaps I'm misunderstanding or overlooking something here. But to me this looks like a bug in the library.

Does anyone know why this happens? Is there a solution?

Hello,

Quick question regarding the map component.  I'm looking to use the map component for some map based charting purposes and was wondering if the opacity style value for the shape can somehow be bound to a data element allowing for the opacity to change based upon the data value assigned to a shape (ie: Pennsylvania data point is 5000 so its opacity would be .8, Ohio data point is 4000 so its opacity would be .65, etc.).  Or is there an easier way to do something like this that i'm missing?

Thanks

Josh F.

I'm trying to figure out how to get smooth scrolling experience when virtul scroll mode is used. Some of the cells in my data can contain a couple, or over 100 words (or more), and when scrolling, the rows skip and jump in an obvious way, and it's not acceptable. I've tried to wrap my head around the RowHeight property without really understanding what it means. As each row in my data can be of different height, setting the proper RowHeight gets inpossible. What is the recommended solution in scenarios like mine? The users would like to see all the content of the cells.

I coded up my own virtual scroll table in javascript some time ago, where I calculated the row height for each row, depending on the text content of the cells, and that made it possible to calculate the total virtual height of the table achieve  smooth scroll. Is there a way to do the same for the TelerikGrid? I'd like to convert to Blazor and TelerikGrid, to get the benefits of sorting, filtering and all that. Using virtual scroll IS probably necessary because there can be hundreds of thousand rows, and the users would prefer to not using paging...

Appreciate any tips here.

Grid code:

<TelerikGrid Data="@MyData"
             Size="@ThemeConstants.Grid.Size.Small"
             ScrollMode="GridScrollMode.Virtual"
             Sortable="true" 
             FilterMode="@GridFilterMode.FilterRow"
             RowHeight="100"
			 PageSize="50"
             Width="1000px"
             Height="600px">
	<GridColumns>
		<GridColumn Title="#" Width="100px">
			<Template>
				@{
					var row = context as ExpandoObject;
					var rowIndex = MyData.IndexOf(row) + 1;
				}
				@rowIndex
			</Template>
		</GridColumn>

		@{
			foreach (var item in MyData.First())
			{
				<GridColumn Field="@item.Key" FieldType="@item.Value.GetType()"
							Title="@item.Key.Replace("_"," ")"
				            Width="@(item.Key.EndsWith("3") ? "300px" : "75px")">
				</GridColumn>
			}
			
		}
	</GridColumns>
</TelerikGrid>

 Just a sample picture of sample data in a sample table:

Hello,

I have a splitter with 2 pane's and in each pane a grid with sizable columns.

When one resizes a column in a grid inside a pane of the splitter one of the panes collapses instead of resizing the column.

Please note: Only the first time when the page is opened it is going not good!

Kind regards,

demo code to reproduce:

We have 2 different instances of Window:

• Editor
• Details

Editor always has too much content to show and Windows automatically adds a vertical scroll bar.  Editor's content is a number of Telerik controls "statically" defined in the Razor.  We also define a height and width.

Details is mostly a <table> with rows built from a foreach loop.  We don't specify a Height or Width.  Sometimes there's too many rows to fit in the dialog given the browser or screen size. Details does not display a vertical scroll bar when there is too much content so much of it is hidden.

How can we get the vertical scroll bar on the Details instance described above?