No keyboard navigation to tick checkbox selection checkbox in EditMode.Normal

[Chuck Richardson]

Hello,

With the following code I can't find a way to tick the select checkbox for a specific row without using the mouse. I can navigate to the header and press space bar when focused on the checkbox and this will correctly select all checkboxes. But if I navigate to any of the checkboxes in the rows I can't clear them or tick them with the space bar or any other keystroke.

@page "/"

@using Syncfusion.Blazor.Grids

@using Syncfusion.Blazor.Inputs

@using Syncfusion.Blazor.Buttons

<SfTextBox Placeholder="TextBox1"></SfTextBox>

<SfTextBox Placeholder="TextBox2"></SfTextBox>

<SfTextBox Placeholder="TextBox3"></SfTextBox>

<SfGrid DataSource="@Orders" AllowSelection="true">

    <GridEditSettings AllowEditing="true" Mode="EditMode.Normal"></GridEditSettings>

    <GridSelectionSettings Mode="SelectionMode.Row"

                        Type="Syncfusion.Blazor.Grids.SelectionType.Multiple"

                        CheckboxMode="CheckboxSelectionType.Default"

                        CheckboxOnly="true"></GridSelectionSettings>

    <GridColumns>

        <GridColumn Type="ColumnType.CheckBox" Width="50"></GridColumn>

        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" IsPrimaryKey="true" TextAlign="TextAlign.Right" Width="120"></GridColumn>

        <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" Width="150"></GridColumn>

        <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn>

        <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn>

    </GridColumns>

</SfGrid>

<SfButton Content="OnFocused"></SfButton>

@code{

    public List<Order> Orders { get; set; }

    protected override void OnInitialized()

    {

        Orders = Enumerable.Range(1, 5).Select(x => new Order()

        {

            OrderID = 1000 + x,

            CustomerID = (new string[] { "ALFKI", "ANANTR", "ANTON", "BLONP", "BOLID" })[new Random().Next(5)],

            Freight = 2.1 * x,

            OrderDate = DateTime.Now.AddDays(-x),

        }).ToList();

    }

    public class Order

    {

        public int? OrderID { get; set; }

        public string CustomerID { get; set; }

        public DateTime? OrderDate { get; set; }

        public double? Freight { get; set; }

    }

}

Please advise how I can make the selection checkbox ticked with the keyboard.

Thanks,

Chuck

[Monisha Saravanan]

Hi Chuck, 

Greetings from Syncfusion support. 

We have analyzed your query and the reported issue does not reproduced at our end. Kindly check the video demonstration of the issue. 

Video: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Checkbox-selection-video548783063.zip 

Here we have selected the checkbox using space key and made navigation through arrow keys. 

If the reported issue still persist then kindly share the below details. 

1. Share the video demo of the issue along with the replication procedure.
2. Share us the Nuget version used.

Also we suggest you to upgrade the Syncfusion NuGet (19.4.0.56) to the latest version and check the reported issue after clearing the NuGet and the browser cache. 

Kindly get back to us if you have further queries. 

Regards, 

Monisha