Hello,
When a Grid is using multi column headers, and I add one more column in the OnBeforeExport event, this new column has no title in the exported file.
A possible workaround might be to use a column with zero Width and change the width in OnBeforeExport.
@using Telerik.Blazor.Common.Export.Excel
@using Telerik.Blazor.Components.Grid
<TelerikGrid TItem="@FlowRun"
Pageable="true"
OnRead="@GetData">
<GridToolBar>
<GridCommandButton Command="ExcelExport" Icon="file-excel">Export to Excel</GridCommandButton>
<GridCommandButton Command="CsvExport" Icon="file-csv">Export to CSV</GridCommandButton>
<label class="k-checkbox-label"><TelerikCheckBox @bind-Value="@ExportAllPages" />Export All Pages</label>
</GridToolBar>
<GridExport>
<GridExcelExport FileName="telerik-grid-export" AllPages="@ExportAllPages" OnBeforeExport="@BeforeExcelExport" />
<GridCsvExport FileName="telerik-grid-export" AllPages="@ExportAllPages" OnBeforeExport="@BeforeCsvExport" />
</GridExport>
<GridColumns>
<GridColumn Field="@nameof(FlowRun.FileName)" Title="File Name" Width="300px" />
<GridColumn Field="@nameof(FlowRun.Type)" Title="Type" Width="100px" />
<GridColumn Field="@nameof(FlowRun.FileSize)" Title="File Size" Width="200px" />
<GridColumn Title="Source">
<Columns>
<GridColumn Field="@(nameof(FlowRun.Source))" Title="MPID"/>
<GridColumn Field="@(nameof(FlowRun.SourceFileProtocol))" Title="Type" />
</Columns>
</GridColumn>
<GridColumn Field="@nameof(FlowRun.ErrorMessage)"
Title = "Error"
Width="0" />
</GridColumns>
</TelerikGrid>
@code {
bool ExportAllPages { get; set; }
private async Task GetData(GridReadEventArgs args)
{
args.Data = Enumerable.Range(1, 10).Select(x => new FlowRun
{
FileName = $"File {x}",
Type = $"Type {x}",
FileSize = x * 2,
Source = $"Source {x}",
SourceFileProtocol = FileProtocol.CIX,
ErrorMessage = $"Error {x}"
}).ToList();
args.Total = 100;
}
private void BeforeCsvExport(GridBeforeCsvExportEventArgs obj)
{
AddErrorMessageColumn(obj);
}
private void BeforeExcelExport(GridBeforeExcelExportEventArgs obj)
{
AddErrorMessageColumn(obj);
}
private void AddErrorMessageColumn(GridBeforeSpreadsheetExportEventArgs args)
{
args.Columns.Find(x => x.Field == nameof(FlowRun.ErrorMessage)).Width = "100px";
//args.Columns.Add(new ExcelExportableColumn
//{
// Field = nameof(FlowRun.ErrorMessage),
// Title = "Error"
//});
}
public class FlowRun
{
public string FileName { get; set; }
public string Type { get; set; }
public long? FileSize { get; set; }
public string Source { get; set; }
public FileProtocol SourceFileProtocol { get; set; }
public string ErrorMessage { get; set; }
}
public enum FileProtocol
{
Unknown,
PIX,
CIX,
SS
}
}
As you can see in the provided example : https://blazorrepl.telerik.com/QcaiPbkL56qf6XQ747
I have the following situation. I'm using a custom editor template with two-way binding for the column : OrderToEdit.ShipCity. If I change the value of this column in a row and press Enter, Tab or mouse focus out very quickly (immediately after value change), UpdateHandler is triggered before the valueChanged event of the context and as a result changes are not shown. If there is a delay ( i.e 1 second ) all works fine. This is not happening when i'm using the builtin editor GridEditorType.TextBox. Could you provide me a solution ?
There is another problem. if a click inside a cell edit mode is triggered. But if i click in a button in the toolbar or in column menu the cell remains open is not closed. I think this should not happen.
Hi,
We ran into an issue with manual binding and selected items with Grid component. I used the 'WebApiFromServerApp' sample in 'grid\datasourcerequest-on-server' folder from Telerik's samples on GitHub.
To recreate the issue, modify 'GridWithService.razor' file in 'WebApiFromServerApp' project. I attached modified project.
To test the behavior:
Thank you.
The CheckBoxList filter does not work as expected when the Grid is bound to ExpandoObject
===
ADMIN EDIT: A possible workaround is to bind the Grid with OnRead event and populate the MemberType property of the filter descriptors manually:
@using System.Dynamic
@using Telerik.DataSource
@using Telerik.DataSource.Extensions
<TelerikGrid OnRead="@OnGridRead"
TItem="@ExpandoObject"
Pageable="true"
Sortable="true"
FilterMode="@GridFilterMode.FilterMenu"
FilterMenuType="@FilterMenuType.CheckBoxList"
Height="400px">
<GridToolBarTemplate>
<GridSearchBox />
</GridToolBarTemplate>
<GridColumns>
@{
if (GridData != null && GridData.Any())
{
<GridColumn Field="PropertyInt" FieldType="@GridPropertyTypes["PropertyInt"]" />
<GridColumn Field="PropertyString" FieldType="@GridPropertyTypes["PropertyString"]" />
<GridColumn Field="PropertyGroup" FieldType="@GridPropertyTypes["PropertyString"]" />
<GridColumn Field="PropertyDate" FieldType="@GridPropertyTypes["PropertyDate"]" />
<GridColumn Field="PropertyBool" FieldType="@GridPropertyTypes["PropertyBool"]" />
}
}
</GridColumns>
</TelerikGrid>
@code {
private List<ExpandoObject> GridData { get; set; } = new List<ExpandoObject>();
private Dictionary<string, Type> GridPropertyTypes { get; set; } = new Dictionary<string, Type>() {
{ "Id", typeof(int) },
{ "PropertyInt", typeof(int) },
{ "PropertyString", typeof(string) },
{ "PropertyGroup", typeof(string) },
{ "PropertyDate", typeof(DateTime) },
{ "PropertyBool", typeof(bool) }
};
private async Task OnGridRead(GridReadEventArgs args)
{
args.Request.Filters.OfType<CompositeFilterDescriptor>()
.Each(x =>
{
x.FilterDescriptors.OfType<FilterDescriptor>()
.Each(y => y.MemberType = GridPropertyTypes[y.Member]);
});
var result = GridData.ToDataSourceResult(args.Request);
args.Data = result.Data;
args.Total = result.Total;
args.AggregateResults = result.AggregateResults;
}
protected override void OnInitialized()
{
for (int i = 1; i <= 18; i++)
{
dynamic expando = new ExpandoObject();
expando.Id = i;
expando.PropertyGroup = $"Group {(i % 3 + 1)}";
expando.PropertyInt = i;
expando.PropertyString = $"String {(char)(64 + i)}{(char)(64 + i)}";
expando.PropertyDate = DateTime.Now.AddMonths(-i);
expando.PropertyBool = i % 2 != 0;
GridData.Add(expando);
}
}
}
Hello,
I want to set AutoGenerateColumns="true", but exclude some of the class members (fields / columns), which I have declared manually in the GridColumns collection.
Navigable="true" + OnRead data binding allow the user to go beyond the last Grid page. The component shows no rows, and even though the user can return to previous pages, it's cumbersome.
The workaround is to manage the Page value manually in the PageChanged handler.
@using Telerik.DataSource.Extensions
@* workaround: *@
@*Page="@GridPage"
PageChanged="@OnGridPageChanged"*@
<TelerikGrid OnRead="@OnGridRead"
Navigable="true"
TItem="@Product"
Pageable="true">
<GridColumns>
<GridColumn Field="@nameof(Product.Name)" Title="Product Name" />
</GridColumns>
</TelerikGrid>
@code {
List<Product> GridData { get; set; }
int GridPage { get; set; } = 1;
int GridTotal { get; set; }
// workaround
void OnGridPageChanged(int newPage)
{
if (newPage > 0 && newPage <= Math.Ceiling((double)GridTotal / (double)10))
{
GridPage = newPage;
}
}
void OnGridRead(GridReadEventArgs args)
{
var result = GridData.ToDataSourceResult(args.Request);
args.Data = result.Data;
args.Total = result.Total;
// workaround
//GridTotal = result.Total;
}
protected override void OnInitialized()
{
GridData = new List<Product>();
var rnd = new Random();
for (int i = 1; i <= 12; i++)
{
GridData.Add(new Product()
{
Id = i,
Name = "Product " + i.ToString()
});
}
}
public class Product
{
public int Id { get; set; }
public string Name { get; set; }
}
}
When Grid is nested in a Window, pressing Escape key will bubble to the Window causing it to close during edit operation of the Grid.
Hello Team,
I am using "FilterMode="GridFilterMode.FilterRow". For int values there is a "numeric chooser" in the column header and the filter option "contains" is not available.
This is the correct behaviour. But when I bind the column to a ulong, ushort, ... value theses seems to be considered as string. There is no "numeric chooser" and the filter "contains" is available, which resullts in further problems with the OData endpoint.
Hi,
When we use custom filters with FilterMenuTemplate in combination with setting filters programmatically, the filter value remains visible after using the 'delete' button.
Simplified example:



Note: We have the same issue with a custom filter with a checkbox list and that code is based on the example of the filter menu template in the documentation.
Note 2: When we use the custom filters and the 'Delete' button without setting the filters programmatically, everything works fine.
It's like the 'Delete' button clears the FilterDescriptors in de Grid State (and we get the data we expect), but the FilterDescriptors in the FilterMenuTemplateContext aren't cleared.. But only when those are set programmatically.. (by setting the grid state).
I already tried to think of a workaround by hooking the OnStateChanged, but there the FilterDescriptors on the grid state are empty when the 'Delete' button is used. As expected, because we get the data we want.. But don't think I can access the FilterMenuTemplateContext there, to clear it as well..
I noticed Telerik Blazor grid is rendered into two tables. One for the headers and one for the contents.
My assumption is that Allyable Scan expects to find a th element inside the second table and it did not find any. Is my assumption correct?
Element source:
<table role="grid" style="width: ;">
Initially, the grid is filtered by "Is FTE? = True". It shows 20 lines. The sum of "Hours" should be 800. But the footer shows another value (depends on the random logic which you've implemented). See the attached screenshot.
Then, when changing the filter, the correct sum is shown.
But I need the correct value initially...
Re: I've just found out that using the OnRead event instead of the standard data binding solves the issue. Better said, it's a possible work-around.
I want to customize the appearance of the header of a certain column, and a bit of CSS backgrounds could help, but I can't do this with the HeaderTemplate alone, nor with content in it because of the padding the cells have.
So, I would like the ability to set the CSS class of the header cell of the column.
The idea of the feature is to be able to customize the list of FilterOperators displayed in the list of the FilterRow and FilterMenu.
FilterRow UI element
FilterMenu UI element
In hierarchical Grid with InCell edit the DateTime cells of the child Grid cannot be edited through the calendar popup. Trying to open the DatePicker or DateTimePicker popup of the child Grid automatically closes the edited cell.