I have a grid that i use to display a number of different items with, some that have the need to display child or hierarchical grids, and some that don“t.
At the moment, all of the items show the "plus" button to expand the child grid, event though there is nothing there to show.
When a collection is null I think that the "plus" button to expand the hierarchical, or child grid, should be hidden.
Or at least I should be able to hide that button manually by choice.
Regards Magnus.
I would like to be able to set Min Width parameter to a Grid Column. The behavior I expect to see is:
Likely related to https://feedback.telerik.com/blazor/1432615-support-for-nested-complex-models
Issue - Filtering / Sorting on a column that is bound to a complex object fails to generate the proper OData string.
Example Grid Code, three columns, column 1 and 3 are bound to a complex class, column 2 just a string:
<TelerikGrid Data=@sysVars.Dtos Pageable="true" Sortable="true" FilterMode="Telerik.Blazor.GridFilterMode.FilterRow" PageSize="20" TotalCount=@sysVars.Count OnRead=@ReadItems>
<GridColumns>
<GridColumn Field=@nameof(SysVar.SysVarType.Name) Title="Type" Editable="false">
<Template>
@{
var data = context as SysVar;
@data.SysVarType.Name
}
</Template>
</GridColumn>
<GridColumn Field=@nameof(SysVar.Value) Title="Value">
<Template>
@{
var data = context as SysVar;
var link = SysVarDto.FrontEndEditUrl(data.Id.Value);
<NavLink href=@link>@data.Value</NavLink>
}
</Template>
</GridColumn>
<GridColumn Field=@nameof(SysVar.Hierarchy.Description) Title="Hierarchy">
<Template>
@{
var data = context as SysVar;
@data.Hierarchy.Description
}
</Template>
</GridColumn>
</GridColumns>
</TelerikGrid>
The values bound to the grid are made up of a complex object. For the sake of the example
public class SysVar
{
public string Value { get; set; }
public Hierarchy Hierarchy { get; set; }
public SysVarType SysVarType { get; set; }
}
public class Hierarchy
{
public string Description { get; set; }
}
public class SysVarType
{
public string Name { get; set; }
}
Right now I know I can't have the Grid render SysVarType.Name, so I use a custom cell and everything works. However, if I try to sort/filter on my complex columns, SysVarType or Hierarchy the resulting OData string that is generated is incorrect.
Example of what is should look like, from a Telerik Grid in my React application if I sort on the sysVarType column:
https://localhost:44335/odata/v1/SysVarOData?$count=true&$expand=sysVarType($select=name),hierarchy($select=description)&$skip=0&$top=20&$orderby=value,sysVarType/name
Same string generated by the Telerik Grid in Blazor
Note: I can't sort two columns at the same time, not a huge issue at this time.
What is failing is the $orderby= doesn't return sysVarType/name and only returns name, causing a 400 on my backend as the class SysVar doesn't have a name field.
I want to expand on another feature request regarding grid excel behaviour.
Like in excel moving into cell enables edit mode. Using arrow keys or enter key moves out of edit mode and do an automatic update of cell. Escape cancels the editing.
With Wpf you have can extend the grid behaviour in order to do things like moving to the beginning of first column of next row when you are on the last column of row and you press the right arrow / tab / enter key
I would like to be able to edit both Date and Time in Grid editing mode.
===
Telerik edit: Possible since version 3.1.0 with through the column EditorType parameter.
Based on row values, I want to style the entire row.
It could perhaps be exposed through something like a "<RowDescriptor>" element inside the <GridColumns>
//ADMIN EDIT: We plan to extend this item so that it includes not only row styling, but also the ability to add CSS classes to the cells, without having to use the Template.
I would like to be able to customize the title in Editing Popup.
<AdminEdit>
We plan to expose the following customization options:
</AdminEdit>
I want to fetch grid records page per page according to the appropriate filter settings. While this is possible through the OnRead event, I want to be able to send the request to the server so that it is easier to fetch the data, like in the UI for ASP.NET Core grid. Currently you can do this only for a server-side project because you can pass the request object by reference, but for a WASM project it needs to serialize in an HTTP request.
---
ADMIN EDIT
You can find examples of doing this here: https://github.com/telerik/blazor-ui/tree/master/grid/datasourcerequest-on-server
---
I have a blazor grid with a large number of columns which I would like to have the width of the page and a horizontal scrollbar to be able to scroll through all of the columns.
According the the documentation I have found (https://demos.telerik.com/blazor-ui/grid/scrolling), setting the width of the grid to 100% and providing widths for the columns which exceed that of the width of the grid/page should cause the horizontal scrollbar to appear. Instead of doing this, however, the grid just expands horizontally to fit all of the columns, no matter what I try. In addition, it appears to be expanding the entire page horizontally to fit itself, as it is increasing the size of all of my bootstrap columns so that it fits within the bootstrap container.
Here is an example of a page containing a grid where I am experiencing this:
@page "/admin/users/manageusers"
@inherits ManageUsersBase
<h3>Manage Users</h3>
<WS7.Components.PDAuthorizeBase AllowedRoleIds="ManageAllUsers,ManageAssignedUsers" />
@if (this.Users == null)
{
<p><em>Loading...</em></p>
}
else
{
<div class="form-group">
<label for="UserSearch" class="col-form-label">Search</label>
<input id="UserSearch" class="form-control" type="search" aria-label="User Search" placeholder="Search" @bind-value="Filter" @bind-value:event="oninput" />
</div>
<TelerikGrid Data="@FilteredUsers" TItem="WS7.Engine.Models.ViewModels.ManageUsersViewModel" Height="600px" Width="100%" Pageable="true" PageSize="40" Sortable="true" Groupable="false"
FilterMode="GridFilterMode.FilterMenu" Resizable="true" Reorderable="true" OnEdit="EditUser" ScrollMode="@GridScrollMode.Scrollable">
<GridToolBar>
<GridCommandButton OnClick="(()=>AddUser())">
<span class="oi oi-plus"></span> Add
</GridCommandButton>
</GridToolBar>
<GridColumns>
<GridCommandColumn Width="100px">
<GridCommandButton Command="Edit" Icon="edit">Edit</GridCommandButton>
</GridCommandColumn>
<GridColumn Field="UserName" Title="User Name" Width="500px" />
<GridColumn Field="Email" Title="Email" Width="500px" />
<GridColumn Field="FirstName" Title="First Name" Width="500px" />
<GridColumn Field="LastName" Title="Last Name" Width="500px" />
<GridColumn Field="AccountStatus" Title="Account Status" Width="500px">
<Template>
@{
string toolTip;
WS7.Engine.Models.ViewModels.ManageUsersViewModel user = context as WS7.Engine.Models.ViewModels.ManageUsersViewModel;
toolTip = "Account Status: " + user.AccountStatus;
toolTip += Environment.NewLine + "Active: " + user.Active.ToString();
toolTip += Environment.NewLine + "Email Confirmed: " + user.EmailConfirmed.ToString();
}
<div class="badge badge-pill badge-info">
<span class="oi oi-info" data-toggle="tooltip" data-placement="top" title="@toolTip"></span>
</div>
</Template>
</GridColumn>
@*<GridCommandColumn Width="90px">
<GridCommandButton Command="Delete" Icon="delete">Delete</GridCommandButton>
</GridCommandColumn>*@
</GridColumns>
</TelerikGrid>
}
---
ADMIN EDIT
You can find some more details on the origin of the issue in the thread below and in the following Knowledge Base article, which also offers a few ideas for solutions to this browser behavior: https://docs.telerik.com/blazor-ui/knowledge-base/grid-bootstrap-flex-width-issue
---
With a pageable grid after scrolling down the first page and then paging, the next page should be scrolled to the top - but it is not.
Is there a way to scroll up by code until this is fixed ???
----
ADMIN EDIT
A sample solution is attached to the end of this post that shows how you can achieve this.
----
Hello,
Do you have any sample for custom group Header template.
e..g. To calculate the value of the column based on the other fields.
---
ADMIN EDIT
---
Once aggregates for all fields are exposed, we will need to provide an option to align them with the corresponding columns. This can be achieved through a GroupHeaderColumnTemplate which is targeted in a separate request.
Hi - this one is a feature request, not a bug. :)
For the filter menu, when you enter a filter value, it would be nice if you could press enter to execute the filter instead of having to click "Filter."
Hiding a grid column causes data columns to be misaligned with headers.
The issue can be reproduced by clicking the "Show/Hide Summary Column" button in the following demo: