1. Home
  2. Forum
  3. Blazor
  4. TAB keyboard does not works if the last column AllowEditing property is set to false

TAB keyboard does not works if the last column AllowEditing property is set to false

Hi there

Working with grid component, Batch editing Mode, When I do not want to allow edition to the last column the tab keyboard is not working as expected it seems is getting stopped in the last column and does not dow to the next row as is expected. This only happens when the last column does not allow editing, if you set the AllowEditing to true it goes to the next row.

I also noticed when I set AllowEdition to false in any column it is necessary to press the tab keyboard twice to go to the next cell.
Adding a demo project.


Attachment: GridBatchEditing_bea57a29.rar

5 Replies
RS Renjith Singh Rajendran Syncfusion Team July 20, 2021 11:34 AM UTC

Hi Adriana, 

Greetings from Syncfusion support. 

Based on this scenario, we suggest you to use EditTemplate for the last editable column. And perform edit programmatically based on Tab key press using @onkeydown event handler for the element inside EditTemplate. We have prepared a sample based on this scenario, please download the sample from the link below, 
 

Please refer the codes below, 

<GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" ...>    <EditTemplate>        <div @onkeydown="@(e=>KeyDownHandler(e, (context as Order).OrderID,"CustomerID"))">            <SfDatePicker ID="OrderDate" @bind-Value="(context as Order).OrderDate"></SfDatePicker>        </div>    </EditTemplate></GridColumn>
 
public async void KeyDownHandler(KeyboardEventArgs args, int? OrderID, string leftField) 
{ 
    if (GridInstance.IsEdit && args.Key == "Tab") 
    { 
        var rowIndex = await GridInstance.GetRowIndexByPrimaryKeyAsync(OrderID); 
        //based on tab key press perform edit for the next editable cell
        await GridInstance.EditCellAsync(rowIndex + 1, leftField); 
    } 
} 


Please get back to us if you need further assistance. 

Regards, 
Renjith R 


AS Adriana Selena Tito Ilasaca July 20, 2021 08:33 PM UTC

Hi

Thanks for the answer, but if I do not know which one will be my last editable column (columns can be showed and hidden by column chooser). For example, if I have an editable column hidden in my column chooser And I decide to show it to the grid the tab won't go to the next editable cell but will automatically go down to the next row.

Another example is if the user decides to hide the column with the edit template and show other columns, the bug of the TAB keyboard will be still present.


I mean is a workaround but not a solution where the bug is not present anymore, I think using edit templates for all of the columns just for that is not okay since we have to bind values and be aware of the component rendered in each column when we have de EditType prop for a column.
 In that case, can this be considered a bug?


VN Vignesh Natarajan Syncfusion Team July 21, 2021 04:45 AM UTC

Hi Adriana, 
 
Thanks for the update.  
 
Query: “I also noticed when I set AllowEdition to false in any column it is necessary to press the tab keyboard twice to go to the next cell.” 
 
We would like to inform that, we have already fixed the this issue (press tab twice to move to next cell) and fix was included in our last release 19.2.0.47. So kindly upgrade to our latest version to resolve the reported issue.  
 
Please find the release notes from below  
 
 
Please get back to us if you have further queries.  
 
Query: “ In that case, can this be considered a bug?” 
 
Now (after upgrading to latest version) the focus is moved to next row when pressing a tab key in last cell. But now we are facing another issue with the PrimaryKey column, where editing is disabled by default. We request you to hide the primarykey column using Visible false, so that editing operation is moved to next cell without any error.  
 
If you so not wish to hide the PrimaryKey column, kindly get back to us. We will validate and update you the alternative solution.  
 
Regards, 
Vignesh Natarajan  


AS Adriana Selena Tito Ilasaca July 21, 2021 02:00 PM UTC

Thanks for the answer It is already working fine, in the version you mention, think not big issue to use just templates for id 


RS Renjith Singh Rajendran Syncfusion Team July 22, 2021 10:26 AM UTC

Hi Adrian, 

Thanks for your update. Please get back to us if you need further assistance. 

Regards, 
Renjith R 


Loader.
Up arrow icon