DataGrid: DataGridMultiSelectColumn - checkbox issue

[PavloParafiloCricut]

Describe the bug
Using DataGridMultiSelectColumn and clicking on checkbox it is displayed as not checked.

As you can see, while row is selected checkbox - not.
Sometimes it becomes selected, sometimes it is not possible to unselect with checkbox (need to click twice)

To Reproduce
Steps to reproduce the behavior:
Use next packages

      <PackageReference Include="Blazorise" Version="0.9.5.5" />
      <PackageReference Include="Blazorise.DataGrid" Version="0.9.5.5" />
      <PackageReference Include="Blazorise.Icons.FontAwesome" Version="0.9.5.5" />
      <PackageReference Include="Blazorise.Material" Version="0.9.5.5" />
    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.1" />
    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.1" PrivateAssets="all" />

Add simple data grid with DataGridMultiSelectColumn

@page "/"
@using System.Dynamic

<DataGrid TItem="Employee"
          Data="@employeeList"
          @bind-SelectedRow="@selectedEmployee"
          SelectionMode="DataGridSelectionMode.Multiple"
          @bind-SelectedRows="selectedEmployees"
          Responsive
          RowSelectable="RowSelectableHandler">
    <DataGridMultiSelectColumn TItem="Employee" Width="30px"></DataGridMultiSelectColumn>
    <DataGridCommandColumn TItem="Employee" />
    <DataGridColumn TItem="Employee" Field="@nameof(Employee.Id)" Caption="#" Sortable="false" />
</DataGrid>
@code {
    private List<Employee> employeeList;
    private Employee selectedEmployee;
    private List<Employee> selectedEmployees;

    protected override async Task OnInitializedAsync()
    {
        employeeList = new List<Employee>() { new Employee() { Id = "1" }, new Employee() { Id = "2" }, new Employee() { Id = "3" } };

        await Task.Delay(300);

        await base.OnInitializedAsync();
    }

    private bool RowSelectableHandler(RowSelectableEventArgs<Employee> rowSelectableEventArgs)
        => rowSelectableEventArgs.SelectReason is not DataGridSelectReason.RowClick;


    public class Employee
    {
        public string Id { get; set; }
    }
}

Try to click on select checkboxes.

Repo with project: https://github.com/PavloParafiloCricut/BlazorApp1

[David-Moreira]

Please try after the next 0.9.5 patch.
#3456

@stsrki any expected date?

[stsrki]

I'm planning to do tne 095x release today.

[PavloParafiloCricut]

Still not fixed in 0.9.5.6
please see ss

[PavloParafiloCricut]

@David-Moreira , hi, any updates?

[David-Moreira]

Hello @PavloParafiloCricut
Really appreciate the repo.

Please follow the setup guide for your provider of choice as there are missing css/js dependencies and we cannot guarantee that everything works 100% otherwise.
https://blazorise.com/docs/usage/material

[PavloParafiloCricut]

@David-Moreira
thank you for response.
Hm, actually I need bootstrap 5 provider but that issue can be replicated on any (tried material too)

It can be replicated even on your demo site https://bootstrap5demo.blazorise.com/tests/datagrid/selection/multiple (Chrome Version 98.0) and locally on you demo solution
Could you please doublecheck?

[David-Moreira]

Hello it does happen on bs5.
We'll take a look, thanks!

Edit: Did you mean to say you reproduce the issue on other providers too?

[PavloParafiloCricut]

Hello it does happen on bs5. We'll take a look, thanks!

Edit: Did you mean to say you reproduce the issue on other providers too?

Thanks for help.
Tried material provider on you demo site - looks ok, so probably it is Boostrap 5 only, please ignore my statement about other providers, cos I am not sure and we need Boostrap 5, where we definitely have an issue.

[PavloParafiloCricut]

Hi @David-Moreira any updates on this?

[David-Moreira]

Hello,
Sorry it took so long. Working on making the fix available soon.

[VultureJD]

@David-Moreira It looks like the default BehaviourProvider for Bootstrap as implemented by your #3559 has now broken custom MultiSelectTemplates that have a checkbox inside them. We have put our own custom checkbox component into the MultiSelectTemplate and now when you click directly on the checkbox, it does not check the box but does select the row. If you click anywhere else in the row, it checks the box as expected. The MultiSelectAll checkbox also still works as expected.

By reverting your change to DataGridRowMultiSelectPreventClick => false, the checkbox in each row is now appearing correctly checked when clicked on.