Hello,
My Grid is setting filters in OnStateInit. Then, the filters are cleared via GridRef.SetState(null)
This used to work until 3.0.1, but not in 3.1.0. Here is a test page:
https://blazorrepl.telerik.com/mmEdFnvA31osNnjO20
If you are in edit mode using InCell, clicking somewhere else inside or outside the Grid should fire OnUpdate if the item is valid. However, if you click on some customly added element in the Grid (e.g. button, icon, dropdown) this will not fire OnUpdate for a valid item.
In Incell edit, clicking anywhere besides the edited cell should fire OnUpdate for a valid input.
---
ADMIN EDIT
---
A possible workaround for the time being - in the OnClick handler of the custom element get the edited item from the Grid State. Update the item and programmatically close the edit mode.
For example: https://blazorrepl.telerik.com/ccuMGovv08NIX6u544.
https://blazorrepl.telerik.com/QGadEnbT24qbDh1G49
If the window component does not implement a Width parameter, it will seem like docked to right when dragging. The issue stems from the update of top and left styles while the width of the component grows with them.
1. Open the repl
2. Initiate dragging
**Workaround**
Set the Width parameter of the Window component
The Grid OnEdit event cannot be cancelled if the user tabs into a cell that should not allow editing.
REPL test page: https://blazorrepl.telerik.com/QcERELbm37c9SzzZ32
Click on "Foo 2" or "Bar 2", and start tabbing. You will be able to edit the values on row 3, which should not happen.
There are two possible workarounds: use a conditional EditorTemplate, or check editability in OnUpdate.
<TelerikGrid Data="@GridData" EditMode="@GridEditMode.Incell" Navigable="true"
OnEdit="@EditItem" OnUpdate="@UpdateItem">
<GridColumns>
<GridColumn Field="@nameof(GridModel.Foo)" Title="Foo (bug)" />
<GridColumn Field="@nameof(GridModel.Bar)" Title="Bar (workaround)">
@*<EditorTemplate>
@{
var item = context as GridModel;
// workaround 1
if (item.IsEditable)
{
<TelerikTextBox @bind-Value="@item.Bar" />
}
else
{
<span class="k-textbox k-input k-rounded-md">
<input class="k-input-inner" tabindex="0" readonly value="@item.Bar" />
</span>
}
}
</EditorTemplate>*@
</GridColumn>
<GridColumn Field="@nameof(GridModel.IsEditable)" Title="Is Row Editable?" Editable="false" />
</GridColumns>
</TelerikGrid>
@code {
List<GridModel> GridData { get; set; }
void EditItem(GridCommandEventArgs args)
{
GridModel item = args.Item as GridModel;
if (!item.IsEditable)
{
args.IsCancelled = true;
}
}
void UpdateItem(GridCommandEventArgs args)
{
var argsItem = args.Item as GridModel;
var index = GridData.FindIndex(i => i.Id == argsItem.Id);
// workaround 2
//if (index != -1 && argsItem.IsEditable)
//{
GridData[index] = argsItem;
//}
}
protected override void OnInitialized()
{
GridData = new List<GridModel>();
for (int i = 1; i <= 5; i++)
{
GridData.Add(new GridModel()
{
Id = i,
Foo = "Foo " + i.ToString(),
Bar = "Bar " + i.ToString(),
IsEditable = i % 2 == 0
});
}
}
public class GridModel
{
public int Id { get; set; }
public string Foo { get; set; }
public string Bar { get; set; }
public bool IsEditable { get; set; }
}
}
Hi, how to show a pointer cursor while mouse over the group arrow icon? I could probably set style="cursor: pointer", but just wondering if there is any other approach. Thanks.
Hello,
If the Grid has X columns at first, and then it renders Y more columns, the new Y columns will not be resizable. Here is a test page.
A possible workaround is to define all columns initially, but hide some of them with Visible="false".
This worked in 2.29 and broke in 2.30.
If you create a second Grid on the page, it will clear the SearchBox input value of the first Grid.
<p><TelerikButton OnClick="@ToggleSecondGrid">Toggle Second Grid</TelerikButton></p>
<TelerikGrid Data="@GridData">
<GridToolBar>
<GridSearchBox />
</GridToolBar>
<GridColumns>
<GridColumn Field=@nameof(Product.ProductName) Title="Product Name" />
</GridColumns>
</TelerikGrid>
@if (ShowSecondGrid)
{
<TelerikGrid Data="@( new List<Product>() )">
<GridColumns>
<GridColumn />
</GridColumns>
</TelerikGrid>
}
@code {
List<Product> GridData { get; set; }
bool ShowSecondGrid { get; set; }
async Task ToggleSecondGrid()
{
ShowSecondGrid = !ShowSecondGrid;
}
protected override void OnInitialized()
{
GridData = new List<Product>();
for (int i = 1; i <= 5; i++)
{
GridData.Add(new Product()
{
ProductId = i,
ProductName = "Product " + i.ToString(),
UnitPrice = (decimal)(i * 3.14),
UnitsInStock = (short)(i * 1),
Discontinued = false
});
}
}
public class Product
{
public int ProductId { get; set; }
public string ProductName { get; set; }
public decimal? UnitPrice { get; set; }
public short? UnitsInStock { get; set; }
public bool Discontinued { get; set; }
}
}
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
How can I get the tooltips for validation of each field displayed at the corresponding field in a Grid Popup form, not just the summary below the Form, etc?
---
ADMIN EDIT
---
This will be handled through exposing an option to set your preferred field validation message type - tooltip or inline. It will cover all edit modes (Popup, Inline, InCell).
If you want to remove the ValidationSummary after adding field validation messages, check the ability to remove ValidationSummary from the Popup edit form.
