Hi Team,
We tried to use the TelerikLoader in Blazor WASM app, but the loader is not appearing on the page. We tried the basic example given in the Demo but did not work.
We are using latest Telerik Version (2.20.0).
@if (IsLoading)
{
<TelerikLoader />
}
else
{
@Data
}
We have below references in index.html
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>THOR.UI</title>
<base href="/" />
<link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
<link href="css/app.css" rel="stylesheet" />
<link href="css/toggle.css" rel="stylesheet" />
<link href="css/spinner.css" rel="stylesheet" />
<script src="_content/Telerik.UI.for.Blazor/js/telerik-blazor.js"></script>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet">
<link id="theme" rel="stylesheet" href="./css/thor-light-theme-material.css" />
<link href="_content/Blazored.Toast/blazored-toast.min.css" rel="stylesheet" />
<script src="./site.js"></script>
<script src="_content/BlazorInputFile/inputfile.js"></script>
<script src="_content/BlazorPro.BlazorSize/blazorSize.min.js"></script>
<script src="_content/Fluxor.Blazor.Web/scripts/index.js"></script>
<script src="./scripts/download.js"></script>
</head>
I tried to follow this below article and add the reference as below and CDN also but it did not work.
<!DOCTYPE html>
<html>
<head>
. . .
<link href="/css/kendo-themes/default/dist/all.css" rel="stylesheet"/>
<!-- Choose only one of the themes -->
<!-- <link href="/css/kendo-themes/bootstrap/dist/all.css" rel="stylesheet" />
<link href="/css/kendo-themes/material/dist/all.css" rel="stylesheet" /> -->
</head>
Please let us know what changes we have to make this to work.
Thanks
Chandra Vanama
1. Create tree model from class:
public class TreeNodeViewModel
{
public string NodeName { get; set; }
public IEnumerable<TreeNodeViewModel> Children { get; set; }
public bool Expanded { get; set; }
public string Color { get; set; }
public string IconClass { get; set; }
}
2. Pass this tree for rendering to the component "TelerikTreeView".
3. An error comes out:
2020-12-03T09:44:15.312Z] Error: System.AggregateException: One or more errors occurred. (Object reference not set to an instance of an object.)
---> System.NullReferenceException: Object reference not set to an instance of an object.
at Telerik.Blazor.Data.TelerikTreeViewDataSource.GetFlatItems(IEnumerable`1 tree, List`1 result)
at Telerik.Blazor.Data.TelerikTreeViewDataSource.GetFlatItems(IEnumerable`1 tree, List`1 result)
at Telerik.Blazor.Data.TelerikTreeViewDataSource.GetFlatItems(IEnumerable`1 tree, List`1 result)
at Telerik.Blazor.Data.TelerikTreeViewDataSource.GetFlatItems(IEnumerable`1 tree, List`1 result)
at Telerik.Blazor.Data.TelerikTreeViewDataSource.FlattenTree()
at Telerik.Blazor.Data.TelerikTreeViewDataSource.InitData(IEnumerable`1 sourceData)
at Telerik.Blazor.Data.TelerikTreeViewDataSource.ProcessData(IEnumerable data)
at Telerik.Blazor.Components.TelerikTreeView.ProcessDataInternal()
at Telerik.Blazor.Components.Common.DataBoundComponent`1.ProcessDataAsync()
at Telerik.Blazor.Components.TelerikTreeView.OnAfterRenderAsync(Boolean firstRender)
--- End of inner exception stack trace ---
Note: This problem is due to the fact that there are no children in the last node of the tree and IEnumerable Children == NULL. Method "GetFlatItems" in version 2.18.0 it had a NULL check, in version 2.20.0 it is not.
Subject says it all. We're porting a large WPF application to Blazor and need WPF Telerik controls with corresponding functionality. One of those controls is the breadcrumb control.
Would need to work in Blazor client or server topologies.
In many cases users need to be able to specify a number which is easily visualized using a horizontal slider.
This allows the user to easily move the point to their desired location.
It can be helpful to allow this to also be constrained using a forced range selection.
Greetings!
Since the focus events are natively supported by blazor, could they be implemented in the input controls? Workarounds via JS are possible but they create a lot of redundant and cluttered code around the code base. OnChange/ValueChange only fire when the value has changed. Though, we have a lot of scenarios where we need the focus events when a value did not change.
I have a numeric text box that is bound to a nullable int. There is also a combo box on the page that will auto set the value and disable the numeric text box if certain values are selected. as follows:
<TelerikComboBox Data="@TareTypes"
TextField="Name" ValueField="Id"
ValueExpression="@(() => Material.TareTypeId)"
ValueChanged="@((int? e) => TareTypeChanged(e))"
Width="200px"
Placeholder="Tare Type" ClearButton="true"></TelerikComboBox>
<TelerikNumericTextBox @bind-Value="@Material.TareWeight" Arrows="false" Enabled="@tareWeightEnabled" ></TelerikNumericTextBox>
and the code...
private void TareTypeChanged(int? tareTypeId)
{
Material.TareTypeId = tareTypeId;
tareWeightEnabled = true;
if (tareTypeId > 0)
{
var tareTypeWeight = TareTypes.Single(t => t.Id == tareTypeId).Weight;
if (tareTypeWeight.HasValue)
{
Material.TareWeight = tareTypeWeight;
tareWeightEnabled = false;
editContext.NotifyFieldChanged(editContext.Field("TareWeight"));
}
}
}
the following steps should reproduce the problem
Hi!
Is there a reason the label has to be defined separately from the label? We'd love a "Label" parameter to be specified in the TelerikCheckbox control directly instead of having to create a separate element
If I set the Visible parameter to false for either ToolBarButton or ToolBarToggleButton it does not hide them from the UI.
<AdminEdit>
A workaround would be to use the Class parameter and add a display:none CSS rules.
Code snippet for the workaround:
<style>
.hidden-button{
display:none;
}
</style>
<TelerikToolBar>
<ToolBarButton Class="hidden-button">Hidden button</ToolBarButton>
<ToolBarButton Icon="@IconName.Star">Visible button</ToolBarButton>
<ToolBarToggleButton Class="hidden-button">Hidden toggle button</ToolBarToggleButton>
<ToolBarToggleButton @bind-Selected="@isSelected">Visible toggle button</ToolBarToggleButton>
</TelerikToolBar>
@code {
public bool isSelected { get; set; } = true;
}
</AdminEdit>
I would like to be able to style, for example, all grids on my page with certain rules. Thus, if each component had a unique class in its top-level rendering I could use it to cascade through it.
This also applies to dropdown/popup elements (for example, be able to target the popups of dropdownlists).
Ideally, elements that have additional popups (like the dropdownlists) will also expose parameters like DropDownClass so I can add my own class to them and style them per instance, so I don't affect all other instances in my app.
We are looking to update our application to Blazor but one of the controls that we use is the Filter Control ( from .Net Core controls).
Any chance a Blazor control can be created for this?
Hello
Just a minor request re. the Grid search box :)
The typical UI behaviour of a search box, is that when you start typing in it, an "X" will appear within the box, allowing you to clear the value.
This would also be consistent with the Blazor combo-box behaviour.
Cheers
Phil
I'm currently migrating a project from ASP.NET MVC to ASP.NET MVC Core.
In the server code I'm using a DataTable from the database which is converted to a DataSourceResult with ToDataSourceResult.
It worked fine in the ASP.NET MVC version, but the same code in the ASP.NET MVC Core version throws an exception when using aggregate functions.
System.InvalidOperationException: 'No generic method 'Sum' on type 'System.Linq.Enumerable' is compatible with the supplied type arguments and arguments. No type arguments should be provided if the method is non-generic. '
First of all, The team loves the product, and development is going 10x faster with a UI library with so many features.
But we're looking for making diagrams inside our application. Something like https://www.syncfusion.com/blazor-components/blazor-diagram
is it a feature currently in the backlog or is it possible to put it there?
That will make us possible to make a flowchart over what assets are connected to each other in our data center