CURD keyboard shortcut in grid

[Duong Quoc]

What are CURD shortcuts in grid? and how to edit the default shortcut to: F4 = Add, F8 = Edit, F5 = Cancel,..

[Sarveswaran Palani]

Hi Duong,

Greetings from Syncfusion support.

From your query, we suspect that you need to customize the keyboard event. If so, we suggest you to use OnKeyDown event. So that it will trigger for all keyboards click function. Based on that we can perform our custom operation. Kindly check the attached code snippet and sample for your reference.

<SfGrid @ref="Grid" DataSource="@Orders" AllowPaging="true" @onkeydown="@KeyDown" Height="315">

    <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true"></GridEditSettings>

    <GridColumns>

     .

     .

     .
    </GridColumns>

</SfGrid>

 

@code {

    public SfGrid<Order> Grid;

    private async Task KeyDown(KeyboardEventArgs args)

    {

        if (args.Key == "F4")

        {

            await Grid.AddRecordAsync();

        }

        else if (args.Key == "F8")

        {

            await Grid.StartEditAsync();

        }

        else if (args.Key == "F5")

        {

            await Grid.EndEditAsync();

        }

    }

 

    public class Order

    {

        public int? OrderID { get; set; }

        public string CustomerID { get; set; }

        public DateTime? OrderDate { get; set; }

        public double? Freight { get; set; }

    }

}

Kindly refer the below link for CRUD operation Shortcuts.

Reference: https://blazor.syncfusion.com/demos/datagrid/keyboard-navigation?theme=fluent

If you have any further queries, please get back to us.

Regards,
Sarvesh

Attachment: SfGridKeyBoardNavigation_61304a00.zip

[Duong Quoc]

When I press F4 and the browser closes, is there any way to solve this problem?

[Naveen Palanivel]

Hi Duong,

Based on your query, it seems that web browser closes when pressing F4. However, we were unable to replicate the reported problem on our end.

If the reported issue still reproduced, then kindly share the below details to validate further at our end.

1. Share us the entire Grid code snippet along with model class
2. Share a screenshot or video demonstration of the issue with a detailed explanation. This will greatly assist us in understanding the problem.
3. Please share if we missed any replication procedure in previously attached sample.
4. If possible, share us a simple issue reproduceable sample or try to modify the above-mentioned sample in pervious update

The above-requested details will be very helpful for us to validate the reported query at our end and provide the solution as early as possible.

Regards,

Naveen Palanivel