Won't Fix
Last Updated: 07 Oct 2024 15:43 by ADMIN
Mark
Created on: 22 Mar 2023 14:33
Category: Grid
Type: Bug Report
3
InCell edit mode: when a cell is in edit mode and the validation is not satisfied, clicking on another cell moves the focus away and Esc press does not cancel the editing
The current cell opened for edit never closes until I click on that cell to return the focus and press Esc.
1 comment
ADMIN
Nadezhda Tacheva
Posted on: 07 Oct 2024 15:43

Hi Mark,

We revised this item with the team and I am stepping in to provide an update.

Based on our keyboard specification, the key commands apply when the corresponding element is focused. In short, the Esc press is expected to close the editing only when the input of the edit cell is focused.

Having this in mind, the reported behavior is not considered a valid bug and I am closing the item. I will share several potential solutions that you can proceed with:

Option 1: Communicate the expected behavior with the users

If possible, ensure that the users are aware of the expected behavior, so they know that in order to cancel the edit they need to keep the focus on the input. This will allow you to keep your configuration as is.

If this is not possible, I can suggest several configuration adjustments - see the next sections.

===

Option 2: Disable the built-in validation

Your initial concern that we discussed in the private ticket was that when the validation is not satisfied, clicking on another cell does not cancel the edit of the current cell.

This is expected based on the design of the InCell edit mode - in this scenario, clicking on another cell is treated as initiating editing for it. If the validation of the currently edited cell is not satisfied, the operation for editing a new cell is blocked until the validation is satisfied or the edit of the current cell is canceled. Details on that can be found in the last section of the notes here: https://docs.telerik.com/blazor-ui/components/grid/editing/overview#notes (For operations like Edit, Add, Save....).

However, you can work this around with a custom approach:

  • Disable the built-in validation - this will not block the edit of a new cell if the current one does not meet the validation requirements.
  • In the OnUpdate handler, check if the updated item meets the validation requirements and update it in your data source only in this case. If you do not update the item in your data, you are effectively canceling the update.
  • (Optional) Use EditorTemplate with a custom editor and a Tooltip to visually indicate to the user that the cell is not valid.

Here is a basic sample that showcases this idea: https://blazorrepl.telerik.com/wIFOOhvJ25qCn8w532.

===

Option 3: Include a Cancel button in the command column

In the general case, it is not needed to include a Cancel command button with the Incell edit mode as the user is able to cancel via Esc press.

However, if you want to allow the user to easily close the edit cell if they have removed the focus from it, you may add a Cancel command button like so: https://blazorrepl.telerik.com/mSbuYrbT29k9ZRrY07.

===

Option 4: Use Inline edit mode

The Inline edit mode allows the user to open a row for editing via Edit button click. Thus, even if the validation is not satisfied, they can still click on the Edit button for another row to open it for edit and the edit of the current invalid one will be canceled.

You may test the behavior in our live demos: Grid - Inline Editing.

Regards,
Nadezhda Tacheva
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.