In addition to more filtering options we would like to have the ability to use custom filter components instead of the built-in ones. For example, through a cell template for the filter row.
Please comment below with how you would like to see this integrate into the data source operations of the grid (for example, should it fire an event where you filter the data you pass to the grid, or should the grid expose some method/interface that you need to use).
When there are wide columns that produce a horizontal scrollbar, scrolling horizontally does not scroll the headers. It must.
WORKAROUND (see also the rules for the containing div that provides the scroll):
<style> .k-grid, .k-grid-container, .k-grid-content.k-virtual-content { display: inline-block; }</style>
REPRODUCIBLE:
@using Telerik.Blazor.Components.Grid<div style="width: 1200px; overflow-x: auto; overflow-y:hidden; border: 1px solid red;"> <TelerikGrid Data="@trades" EditMode="inline" Pageable=true PageSize=10> <TelerikGridColumns> <TelerikGridCommandColumn width="100"> <TelerikGridCommandButton Command="Edit" Icon="edit">Edit</TelerikGridCommandButton> <TelerikGridCommandButton Command="Update" Icon="save" ShowInEdit="true" OnClick="UpdateItem">Update</TelerikGridCommandButton> <TelerikGridCommandButton Command="Cancel" Icon="cancel" ShowInEdit="true" OnClick="CancelItem">Cancel</TelerikGridCommandButton> </TelerikGridCommandColumn> <TelerikGridColumn Field="@(nameof(Trade.TradeId))" Width=100></TelerikGridColumn> @*<TelerikGridColumn Field="@(nameof(Trade.TradeType))" Width=200></TelerikGridColumn>*@ <TelerikGridColumn Field=@nameof(Trade.TradeType) Title="Trade Type"> <EditorTemplate> @{ var TradeToEdit = context as Trade; if (TradeToEdit.TradeType == "POWER PHYSICAL") { <select class="form-control d-inline" style="height: 30px" onchange=@SaveItem value=@TradeToEdit.TradeType> <option value="POWER PHYSICAL">POWER PHYSICAL</option> <option value="GAS PHYSICAL"> GAS PHYSICAL</option> </select> } else { <select class="form-control d-inline" style="height: 30px" onchange=@SaveItem value=@TradeToEdit.TradeType> <option value="GAS PHYSICAL"> GAS PHYSICAL</option> <option value="POWER PHYSICAL">POWER PHYSICAL</option> <option value="POWER PHYSICAL">POWER FINANCIAL</option> </select> } } </EditorTemplate> </TelerikGridColumn> <TelerikGridColumn Field="@(nameof(Trade.Company))" Width=500></TelerikGridColumn> <TelerikGridColumn Field="@(nameof(Trade.TradeDate))" Width=500></TelerikGridColumn> <TelerikGridColumn Field="@(nameof(Trade.BegTime))" Width=500></TelerikGridColumn> <TelerikGridColumn Field="@(nameof(Trade.EndTime))" Width=500></TelerikGridColumn> </TelerikGridColumns> </TelerikGrid></div>@functions { public class Trade { public int TradeId { get; set; } public string TradeType { get; set; } public string Company { get; set; } public DateTime TradeDate { get; set; } public DateTime BegTime { get; set; } public DateTime EndTime { get; set; } } public List<Trade> trades { get; set; } protected override void OnInit() { trades = new List<Trade>(); for (int i = 0; i < 25; i++) { trades.Add(new Trade() { TradeId = i, TradeType = "type " + i, Company = "company " + i, TradeDate = DateTime.Now.AddDays(i), BegTime = DateTime.Now.AddHours(-i), EndTime = DateTime.Now.AddHours(i) }); } } void SaveItem() { } public void UpdateItem(GridCommandEventArgs e) { } public void CancelItem(GridCommandEventArgs e) { }}
Dear Telerik,
I'd like to post a new feature request- > A checkbox column.
Where it is possible to select multiple rows.
Regards,
Gert
So far in the TelerikGrid component it is only possible to set the title of a column to a string. It would be useful to give the title/header a template instead of a simple string. In this way one could for example place a button, image, (...) inside the columnheader.
This kind of template-ability could be very handy in various other cases elsewhere, so please bring this flexibility into ui for blazor.
When I click TelerikGridCommandButton and inside OnClick event calling method uriHelper.NavigateTo("/xxx"); application hangs.
Using latest VS 2019 version and Blazor Preview 4
The TelerikGrid never loads any data. the app just hangs.
I copied the Telerik sample from the online demo.
The HTML table loads perfectly.
Using VS 2019 16.1.0 Preview 2.0.
Acquired Telerik nuget package directly from Telerik feed.
<TelerikGrid Data=@ViewModel.GetCorePharmacies() Height="300">
<TelerikGridColumns>
<TelerikGridColumn Field="ID" Title="NCPDP#" />
<TelerikGridColumn Field="NPINumber" Title="NPI#" />
<TelerikGridColumn Field="DBAName" Title="Pharmacy" />
<TelerikGridColumn Field="StoreNumber" Title="Store#" />
</TelerikGridColumns>
</TelerikGrid>
@*<table class="table">
<thead>
<tr>
<th>NCPDP</th>
<th>NPI</th>
<th>DBA Name</th>
<th>Store#</th>
</tr>
</thead>
<tbody>
@foreach (var pharmacy in ViewModel.GetCorePharmacies())
{
<tr>
<td>@pharmacy.ID.ToString()</td>
<td>@pharmacy.NPINumber.ToString()</td>
<td>@pharmacy.DBAName</td>
<td>@pharmacy.StoreNumber</td>
</tr>
}
</tbody>
</table>*@
Any thoughts.
Hello there,
I am looking for the ability to display hierarchical data in the grid control similar to that available in the asp.net core grid: https://demos.telerik.com/aspnet-core/grid/hierarchy
Thanks!