It would be nice to be able to configure a show/hide animation for windows.
ADMIN EDIT: This might include a form of a Shown event so that you could know when the content is rendered and available to, for example, focus a button or input. For more details see here
By the following steps, the problem occurs:
So, it not possible to navigate through the whole grid with virtualized rows when Navigable=true
@* Scroll the grid instead of paging *@
<TelerikGrid Data=@GridData
ScrollMode="@GridScrollMode.Virtual" Navigable="true"
Height="480px" RowHeight="60" PageSize="20"
Sortable="true" FilterMode="@GridFilterMode.FilterMenu">
<GridColumns>
<GridColumn Field="Id" />
<GridColumn Field="Name" Title="First Name" />
<GridColumn Field="LastName" Title="Last Name" />
<GridColumn Field="HireData" Width="200px">
<Template>
@((context as SampleData).HireDate.ToString("MMMM dd, yyyy"))
</Template>
</GridColumn>
</GridColumns>
</TelerikGrid>
@code {
public List<SampleData> GridData { get; set; }
protected override async Task OnInitializedAsync()
{
GridData = await GetData();
}
private async Task<List<SampleData>> GetData()
{
return Enumerable.Range(1, 1000).Select(x => new SampleData
{
Id = x,
Name = $"name {x}",
LastName = $"Surname {x}",
HireDate = DateTime.Now.Date.AddDays(-x)
}).ToList();
}
public class SampleData
{
public int Id { get; set; }
public string Name { get; set; }
public string LastName { get; set; }
public DateTime HireDate { get; set; }
}
}
Greetings!
I've been waiting for a few months now to swap to blazor, but one of the things that's currently holding us back is that the filter row can't be used together with the column menu.
I've always found this to be strange, since it's supported in the Angular and MVC versions, which we currently use.
Our users never filter via the column menu, always via the filter row. They hide/lock their columns via the column menu and sometimes sort.
This functionality is thus critical for us.
I can't find any feature request for it, nor any planned roadmap item.
Will this ever be supported because if not, we're gonna have to start looking for alternatives.
Kind regards.
Is a ListBox control, similar to https://demos.telerik.com/aspnet-core/listbox/index, on the roadmap currently?
---
ADMIN EDIT
You can use a grid that has 1 column for the text you want to show with selection and perhaps even row dragging, and maybe hide its headers with css if you do not want them.
---
Hi,
Could you expose the Print Command of Blazor PDF Viewer? I would like to call it from within my code.
Regards
Gerald Man
Here is a TelerikForm with a FormItem (1) for a boolean field. Another FormItem (2) should render, depending on the boolean field (1). This does not work with a TelerikForm, but works with a standard EditForm.
The workaround for a TelerikForm is to use a FormItem Template with a TelerikCheckBox. This is demonstrated below as well.
<EditForm Model="@_data">
<label>Condition 1 (InputCheckbox):</label>
<InputCheckbox @bind-Value="@_data.Value1" />
<br />
@if (_data.Value1)
{
<label>Result 2</label>
<InputCheckbox DisplayName="Result 2:" @bind-Value="@_data.Value2"></InputCheckbox>
}
</EditForm>
<h1>TelerikForm</h1>
<TelerikForm Model="@_data">
<FormItems>
<FormItem LabelText="Condition 1 (FormItem):" Field="@nameof(_data.Value1)"></FormItem>
<FormItem>
<Template>
<label for="x">Condition 1 (TelerikCheckBox):</label>
<br />
<TelerikCheckBox Id="x" @bind-Value="_data.Value1" />
</Template>
</FormItem>
@if (_data.Value1)
{
<FormItem LabelText="Result 2:" Field="@nameof(_data.Value2)"></FormItem>
}
</FormItems>
</TelerikForm>
@code {
private ExampleDto _data { get; set; } = new ExampleDto();
public class ExampleDto
{
public string TextValue { get; set; }
public bool Value1 { get; set; }
public bool Value2 { get; set; }
}
}
After updating the chart data, some elements remain in the DOM. This can clutter the browser if the data updates come in on intervals and the chart remains in operation for a while. A screenshot is attached below.
MCVE:
@
using
Telerik.Blazor
@
using
Telerik.Blazor.Components.Button
@
using
Telerik.Blazor.Components.Chart
<h3>Chart</h3>
<TelerikButton Primary=
"true"
@onclick=
"AddDataPoint"
>Add data point</TelerikButton>
<TelerikChart Transitions=
"false"
>
<TelerikChartSeriesItems>
<TelerikChartSeries Type=
"ChartSeriesType.Line"
Name=
"CPU Usage Data"
Data=
"@simpleData"
>
</TelerikChartSeries>
</TelerikChartSeriesItems>
<TelerikChartValueAxes>
<TelerikChartValueAxis Max=
"100"
Color=
"black"
></TelerikChartValueAxis>
</TelerikChartValueAxes>
<TelerikChartTitle Text=
"CPU Usage"
></TelerikChartTitle>
<TelerikChartLegend Position=
"Telerik.Blazor.ChartLegendPosition.Bottom"
>
</TelerikChartLegend>
</TelerikChart>
@code {
void
AddDataPoint()
{
Random random =
new
Random();
var _val = Math.Round((random.NextDouble() * 100), 3);
if
(simpleData.Count >= 60)
{
simpleData = simpleData.TakeLast(59).ToList();
}
simpleData.Add(_val);
//StateHasChanged();
}
public
List<
object
> simpleData =
new
List<
object
>();
}
Currently, you can split the TelerikForm into multiple columns via the Columns parameter. These columns will have equal widths. I would like to have the ability to define custom width per column.
<AdminEdit>
You can use the following code snippet as a workaround with some considerations:
<style>
.non-equal-columns .k-form-layout.k-grid-cols-2 {
grid-template-columns: 71% 28.5%;
}
</style>
@using System.ComponentModel.DataAnnotations
<TelerikForm Model="@person" ColumnSpacing="25px" Columns="2" Class="non-equal-columns">
<FormValidation>
<DataAnnotationsValidator></DataAnnotationsValidator>
</FormValidation>
<FormItems>
<FormGroup LabelText="Personal Information" ColumnSpacing="15px">
<FormItem LabelText="First Name" Field="@nameof(Person.FirstName)"></FormItem>
<FormItem LabelText="Last Name" Field="@nameof(Person.LastName)"></FormItem>
<FormItem LabelText="Age" Field="@nameof(Person.Age)"></FormItem>
<FormItem LabelText="Email" Field="@nameof(Person.Email)"></FormItem>
</FormGroup>
<FormGroup LabelText="Employee Information" Columns="2" ColumnSpacing="15px">
<FormItem LabelText="Company Name" Field="@nameof(Person.CompanyName)"></FormItem>
<FormItem LabelText="Position" Field="@nameof(Person.Position)"></FormItem>
</FormGroup>
</FormItems>
</TelerikForm>
@code {
public Person person { get; set; } = new Person();
public class Person
{
[Required(ErrorMessage = "The First name is required")]
public string FirstName { get; set; }
[Required(ErrorMessage = "The Last name is required")]
public string LastName { get; set; }
[Range(18, 120, ErrorMessage = "The age should be between 18 and 120")]
public int Age { get; set; }
[Required]
[EmailAddress(ErrorMessage = "Enter a valid email")]
public string Email { get; set; }
[Required]
public string CompanyName { get; set; }
[MaxLength(25, ErrorMessage = "The position can be maximum 25 characters long")]
public string Position { get; set; }
}
}
</AdminEdit>
I want horizontal and vertical lines in the chart to act as markers (limits, thresholds). It would be awesome if there was a way to simply draw a horizontal and vertical lines, bound to a collection of y and x data respectively.
Something like the below would be nice
<TelerikChart>
<ChartSeriesItems>
<ChartSeries Type="@ChartSeriesType.Line" Name="@P_Name1" Color="blue"
Data="@P_Data1"
Field="@P_Field1"
CategoryField="@P_CategoryField1">
<ChartSeriesLabels Visible="true" Template="#=dataItem.P_Description#" />
<ChartSeriesMarkers Size="4" />
</ChartSeries>
<ChartHorizontalLines Data="@YLinesData"/>
<ChartVerticalLines Data="@XLinesData"/>
</ChartSeriesItems>
</TelerikChart>
@code{
List<double> YLinesData, XLinesData;
}
---
ADMIN EDIT
You can find some more details and ideas for workarounds here to consider in the meantime.
---
Hi,
I would like to be able to show / hide a serie by clicking to a legend.
Is there a way to do it actually ?
Hi Telerik Support.
I am using TelerikComboBox with Virtualization and enabled Filtering. If I filter for a text and then scroll down, the filter text gets cleared. I am using OnRead event to populate the combo box. But the same issue is seen with local data population in the below sample code.
https://demos.telerik.com/blazor-ui/combobox/virtualization
I need to show the user the text they have entered even when they scroll down to the next page. Is there a solution for this?
Regards
Bably