Am I correct that it is currently not possible to have a form field that is both formatted as currency and has a hint text? In order to format as anything, it seems we need to use templates, and if we do, the stuff like HintText, Labeltext etc also goes missing?
Having to always use templates for most basic stuff in grids, forms etc. like getting a bool to show up as a checkbox or a simple int to be displayed as currency, is really starting to get to me to be honest...
*** UPDATE If I remove the set culture code, then it works **
Adding Format="{0:d}" to this code Telerik REPL for Blazor - The best place to play, experiment, share & learn using Blazor.
works fine.
If I try to do the same I get this:
First Format="{0}"
Using Format="{0:d}" I get this. Same when I use any other formats like Format="{0:yyyy.MM.dd}"
When not using any kind of format. Not good enough. Missing the year
<TelerikChart RenderAs="RenderingMode.Canvas">
<ChartTitle Text="Prices"/>
<ChartTooltip Visible="true"/>
<ChartLegend Position="ChartLegendPosition.Bottom"/>
<ChartSeriesItems>
<ChartSeries Type="ChartSeriesType.Line"
Name=""
Data="@Details.PriceGraphs"
DashType="@DashType.Solid"
CategoryField="@nameof(InstrumentPriceGraph.UpdateDate)"
Field="@nameof(InstrumentPriceGraph.Price)">
</ChartSeries>
</ChartSeriesItems>
<ChartValueAxes>
<ChartValueAxis Min="@_yMinValue" Max="@_yMaxValue"/>
</ChartValueAxes>
<ChartCategoryAxes>
<ChartCategoryAxis Type="ChartCategoryAxisType.Date" BaseUnit="ChartCategoryAxisBaseUnit.Days">
<ChartCategoryAxisLabels Step="2" Format="{0:d}">
<ChartCategoryAxisLabelsRotation Angle="-45"/>
</ChartCategoryAxisLabels>
</ChartCategoryAxis>
</ChartCategoryAxes>
</TelerikChart>
var culture = new CultureInfo("da-DK");
culture.DateTimeFormat.ShortDatePattern = "dd-MM-yyyy";
CultureInfo.DefaultThreadCurrentCulture = culture;
CultureInfo.DefaultThreadCurrentUICulture = culture;
1. I am creating a pie chart and the element the chart is nested in has a white background I cant seem to change please help.
2. I am using custom styling and have left out a component I would like to add a single component. I have however changed some of the default telerik styling in the file is there a way I can get the exclusive css for a single component without needing a whole new file?
thanks
https://docs.telerik.com/blazor-ui/components/stepper/events
According to the docs, it says the OnChange event fires before the current step has changed. I'm assuming clicking the Stepper itself triggers this event, but what if I wanted to go to the next step by clicking on a custom button that I've created? This seems like a common use case, is this possible with the stepper?
I don't want to use the Wizard component because it doesn't seem possible to customize it to match my requirement: I want to keep all previous steps' content rendered on the page vertically as you progress through the wizard instead of having the each step content replaced by the next step content. The documentation doesn't seem to allow for customization of the step content rendering behaviour but please correct me if I'm wrong (https://docs.telerik.com/blazor-ui/components/wizard/structure/content).
Is there a way I can replace the checkbox with button for the selection of the row in the grid?
Blazor DataGrid Demos - CheckBox Only Selection | Telerik UI for Blazor
Hi,
I am using the TelerikMenu Blazor component and I am trying to change the background color of the submenu items when being hovered over. I can successfully change the hover colors for the top-level menus but not the submenus. When I am running the app, I can go into developer tools and write the css to change the submenu background when being hovered over, but when I try that same css in my page css file, only the top-level menu items are affected (meaning the hover affect only happens to the top-level menu), I have attached a picture of the submenu with a background color change on hover via Developer Tools.
I am probably missing a hierarchy level in the css - any assistance is appreciated.
Thanks,
Mike
Menu creation tag:
<nav class="navbar navbar-dark navbar py-md-0" id="navbar-custom-style">
<span class=" k-link k-menu-link">
<TelerikMenu Data="MenuItems" UrlField="@nameof(MenuItem.Page)" Orientation="MenuOrientation.Horizontal" Class="centered-menu">
</TelerikMenu>
</span>
</nav>
Menu creation code:
public List<MenuItem> MenuItems { get; set; }
protected override async Task OnInitializedAsync()
{
List<MenuItem> menuItems = new List<MenuItem>()
{
new MenuItem { Text = "Home", Page = "/", IconClass="oi oi-home" },
new MenuItem { Text = "Application Health", Items = new List<MenuItem>()
{
new MenuItem { Text = "Counter", Page = "/counter" },
new MenuItem { Text = "Batch Review", Page = "/batchreview", IconClass="oi oi-bar-chart" },
new MenuItem { Text = "Closed Items", Page = "" },
}, IconClass="oi oi-heart" },
new MenuItem { Text = "Fetch Data", Page = "/fetchdata", IconClass="oi oi-rich" },
};
MenuItems = menuItems;
}
Menu CSS (only affects top level menus):
::deep .centered-menu.k-menu .k-item {
color: white;
font-weight: bold;
background: #007DBC;
padding: 0;
}
::deep .k-item.k-menu-item:hover {
color: whitesmoke;
background-color: #0b6fa4;
}
When I add this to my page css from the dev tools (which only affected the sub-menus), only the top menu items are affected:
::deep li.k-item.k-menu-item:hover {