I have a filterable DropDownList in a Grid EditorTemplate. The edit mode is InCell.
When the user opens the dropdown, the edited cell closes immediately with an OnUpdate call. The DropDownList value can be changed only with the keyboard or if I disable DropDownList filtering.
===
The same problem occurs with any component that uses a popup and the popup can gain focus - ComboBox, ColorPicker, etc.
When you type something in the grid searchbox, there will be a X at the end to clear the box.
However, if you restore the grid from previously stored state like localstorage, and if the box has value, the X is not there.
Thanks!
The exception is -
System.ArgumentNullException: Value cannot be null. (Parameter 'source')
Here is a test page, based on this one -
@using Telerik.DataSource
@using Telerik.DataSource.Extensions
@using System.IO
<TelerikGrid TItem="@object"
LoadGroupsOnDemand="true"
Groupable="true"
OnStateInit="@((GridStateEventArgs<object> args) => OnStateInitHandler(args))"
OnRead="@ReadItems"
ScrollMode="@GridScrollMode.Virtual" PageSize="20" RowHeight="60"
Navigable="true" Sortable="true" FilterMode="@GridFilterMode.FilterRow" Height="600px">
<GridColumns>
<GridColumn Field="@nameof(Employee.Name)" FieldType="@typeof(string)" Groupable="false" />
<GridColumn Field="@nameof(Employee.Team)" FieldType="@typeof(string)" Title="Team" />
<GridColumn Field="@nameof(Employee.Salary)" FieldType="@typeof(decimal)" Groupable="false" />
<GridColumn Field="@nameof(Employee.IsOnLeave)" FieldType="@typeof(bool)" Title="On Vacation" />
</GridColumns>
</TelerikGrid>
@code {
List<object> GridData { get; set; }
protected async Task ReadItems(GridReadEventArgs args)
{
DataEnvelope<Employee> result = await MyService.GetData(args.Request);
if (args.Request.Groups.Count > 0)
{
args.Data = result.GroupedData.Cast<AggregateFunctionsGroup>().ToList();
}
else
{
args.Data = result.CurrentPageData.Cast<Employee>().ToList();
}
args.Total = result.TotalItemCount;
if (args.Request.Groups.Count > 0)
{
try
{
List<AggregateFunctionsGroup> items = result.GroupedData.Cast<AggregateFunctionsGroup>().ToList();
await using var s = new MemoryStream();
await System.Text.Json.JsonSerializer.SerializeAsync(s, items);
}
catch (Exception e)
{
Console.WriteLine(e);
}
}
}
void OnStateInitHandler(GridStateEventArgs<object> args)
{
// set initial grouping
GridState<object> desiredState = new GridState<object>()
{
GroupDescriptors = new List<GroupDescriptor>()
{
new GroupDescriptor()
{
Member = "Team",
MemberType = typeof(string)
},
new GroupDescriptor()
{
Member = "IsOnLeave",
MemberType = typeof(bool)
}
}
};
args.GridState = desiredState;
}
public class Employee
{
public int EmployeeId { get; set; }
public string Name { get; set; }
public string Team { get; set; }
public bool IsOnLeave { get; set; }
public decimal Salary { get; set; }
}
public class DataEnvelope<T>
{
public List<AggregateFunctionsGroup> GroupedData { get; set; }
public List<T> CurrentPageData { get; set; }
public int TotalItemCount { get; set; }
}
public static class MyService
{
private static List<Employee> SourceData { get; set; }
public static async Task<DataEnvelope<Employee>> GetData(DataSourceRequest request)
{
if (SourceData == null)
{
SourceData = new List<Employee>();
var rand = new Random();
for (int i = 1; i <= 2500; i++)
{
SourceData.Add(new Employee()
{
EmployeeId = i,
Name = "Employee " + i.ToString(),
Team = "Team " + i % 100,
IsOnLeave = i % 3 == 0,
Salary = rand.Next(1000, 5000)
});
}
}
await Task.Delay(500);// deliberate delay to showcase async operations, remove in a real app
// retrieve data as needed, you can find more examples and runnable projects here
// https://github.com/telerik/blazor-ui/tree/master/grid/datasourcerequest-on-server
var datasourceResult = SourceData.ToDataSourceResult(request);
DataEnvelope<Employee> dataToReturn;
if (request.Groups.Count > 0)
{
dataToReturn = new DataEnvelope<Employee>
{
GroupedData = datasourceResult.Data.Cast<AggregateFunctionsGroup>().ToList(),
TotalItemCount = datasourceResult.Total
};
}
else
{
dataToReturn = new DataEnvelope<Employee>
{
CurrentPageData = datasourceResult.Data.Cast<Employee>().ToList(),
TotalItemCount = datasourceResult.Total
};
}
return await Task.FromResult(dataToReturn);
}
}
}
So what I propose is a fixed width for a column of the grid (and locked) with the remaining columns auto-sizing.
In my situation, I have an action switch button where the client can delete a row, edit a row etc but the action code dropdown column needs to ALWAYS be the same width. The rest of the columns should automatically size based on the existing behaviour.
Now I have tried using the autosize for just that column, but I have to render the grid first, then run the autosize (which gives a fun show of resizing to the user) then all the columns become fixed width, but the vertical scroll bar doesn't move and stays in its initial position.
The filter list item menu defined as follows do not have accessible name. Please provide work around or fix that I can implement.
<TelerikGrid Data="@ViewModel.RouterAndDataLossInformation" TItem="TrafficLossSummary"
Pageable="true"
Sortable="true"
Groupable="false"
FilterMode="Telerik.Blazor.GridFilterMode.FilterRow"
Resizable="true"
Reorderable="true"
Height = "100%">
The `Context` of `<GridColumn>` is of type `object`, requiring typecasting in order to use the value.
Instead, make `<GridColumn>` generic so that `Context` is strongly typed. If you use `TItem` as the name for the generic then Blazor will infer it without the user having to specify it.
As of UI for Blazor 4.0. ExcelExportableColumn is inaccessible due to its protection level and GridExcelExportColumn should be used instead.
I am trying to add the hidden columns to the exported file through the OnBeforeExport event. However, I am unable to create an exportable column instance using the GridExcelExportColumn. I get the following error:
CS1729: GridExcelExportColumn does not contain a constructor that takes 0 arguments.
When I autofit all columns multiple times in a row, the Grid misbehaves and wraps longer column content in multiple lines.
<AdminEdit>
As a workaround, set the MinResizableWidth parameter of the Grid columns that wrap their content.
</AdminEdit>
Currently, the empty cells in the exported Excel file contain zero-length strings. As a result, the ISBLANK() function returns false for them while the cells essentially do not have content.
Please allow the empty Grid cells to be treated as blank in the exported Excel file.
===
ADMIN EDIT
===
For the time being, you may extend the formula to also check whether the length of the cell content is 0. For that purpose, you may use the LEN() function as suggested here: https://learn.microsoft.com/en-us/office/troubleshoot/excel/isblank-function-return-false#workaround.
We found out during SQL profiling that when bound to an IQueryable (linked to DbContext) with pagination enabled, the Telerik data grid called SQL to count elements twice. This is not a pre-render problem as those deplicated queries are actually executed twice (one pair for each render).
Our simplified code:
<TelerikGrid TItem="Item"
Data="_data"
PageSize="10"
Pageable="true"
Sortable="true">
<GridColumns>
<GridColumn Field="@nameof(Item.Id)" />
<GridColumn Field="@nameof(Item.Code)" />
</GridColumns>
</TelerikGrid>
@code {
[Inject] protected DbContext DbContext { get; set; }
private IEnumerable<Item> _data;
protected override void OnInitialized()
{
base.OnInitialized();
_data = DbContext.Items
.Select(x => new Item()
{
Id = x.Id,
Code = x.Code
});
}
}===
ADMIN EDIT:
There are two possible ways to avoid the double COUNT:
When initial grouping is set through the state, the GroupFooterTemplate does not render. One has to perform some action for refreshing the Grid in order to display the template - for example, collapsing/expanding a group.
For reference, the GroupHeaderTemplate renders correctly.
Reproduction: https://blazorrepl.telerik.com/wRaJFgFy10vagYnf05
===
ADMIN EDIT
===
The GroupFooterTemplate renders with a delay after the Grid. A possible workaround for the time being is to refresh the Grid after it has been initialized to ensure the GroupFooterTemplate will be displayed.
When I define a bigger number of MultiColumn Header the rendering performance of the Grid component quickly deteriorates.
I would like an improvement in this regard.
Using the following configuration does not produce the expected result:
<GridSettings>
<GridPopupEditFormSettings ButtonsLayout="FormButtonsLayout.Center"/>
</GridSettings>
The button layout is always left no matter what you choose.
===
ADMIN EDIT
===
Possible workarounds for the time being are to position the buttons with CSS or use a Popup Buttons Template.
Hello,
in some cases there is no way to scroll grid using mousewheel. Try this REPL please - https://blazorrepl.telerik.com/GdkXuLuX10P8sOF040. Scroll down, focus any cell in the last row and try to scroll up using your mouse wheel again. Grid always scrolls back to the last row.
Can you check that please?
Very thanks.
Miroslav
On Hierarchy grids with Inline edit mode, I noticed that if a row is currently being edited and I try to expand the row to show the child grid an exception is thrown: "Error: System.InvalidOperationException: TelerikValidationComponent requires a cascading parameter of type EditContext. You can use Telerik.Blazor.Components.TelerikValidationTooltip`1[System.String] inside a EditForm or TelerikForm".
The problem stems from a validation tool inside the Grid EditorTemplate.
When PageSize is set to "All" and a new item is added to the grid's data source, the PageSize parameter is not updated, so the new item is sent to a second page. Instead of being added at the top or bottom of the page.
Reproduction
1. Run this REPL
2. Set PageSize to All from the dropdown at the bottom
3. Add a new item from Update Data or Add
4. New Item is added to the second page
5. Video Example
There is a change in the Grid behavior from version 4.6.0 to 5.0.0.
Consider the following REPL test page: https://blazorrepl.telerik.com/cSabmRPy306iPiXK18
Clicking on a Grid cell for editing will not open it for editing if there is already an open cell in edit mode on the same table row. The issue is reproduced more easily if the OnUpdate handler is empty or not defined at all.
This used to work in version 4.6.0.