CheckBox Selection

Hello,

I want to select multiple rows in a TreeGrid or Grid with checkboxes. We have a client side blazor project with newest syncfusion version 18.1.54!
I tested the selection according the examples on your documentation site (TreeGrid and Grid) but I have some problems:

- Grid: if I select a row the last selected row is not in the list I get with: await controlRefObject.GetSelectedRecords(). I checked the result in the events row selected, selecting, deselect, deselcting... always one row is missing!
Code:
<SfGrid @ref="gridSwcChilds" ID="targetSwc" DataSource="@HiCoSwcChildrenCollection" AllowSelection="true" TValue="HiCoSwc" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Delete", "Edit", "Cancel" })" ShowColumnMenu="true" @bind-AllowFiltering="@ShowSwcFiltering" @bind-AllowGrouping="@ShowSwcGrouping" AllowSorting="true">
     <GridEvents TValue="HiCoSwc" RowSelecting="GetSelectingSwcPartRow" RowSelected="GetSelectedSwcPartRow" RowDeselected="GetDeSelectedSwcPartRow"/>
                              <GridPageSettings PageSize="5" /> 
                              <GridSelectionSettings Type="SelectionType.Multiple" CheckboxMode="CheckboxSelectionType.ResetOnRowClick" Mode="SelectionMode.Row" PersistSelection="true"/>
     <GridColumns>
          <GridColumn Type="ColumnType.CheckBox" Width="50"/>
          <GridColumn Field="@nameof(HiCoSwc.ID)" HeaderText="ID" IsPrimaryKey="true" AllowResizing="true" />
          <GridColumn Field="@nameof(HiCoSwc.ParentID)" HeaderText="Parent ID" AllowResizing="true" />
          <GridColumn Field="@nameof(HiCoSwc.Name)" HeaderText="Name" AllowResizing="true" />
          <GridColumn Field="@nameof(HiCoSwc.TypeInformation)" HeaderText="Details" AllowResizing="true" />
     </GridColumns>
</SfGrid>
public async void GetSelectingSwcPartRow(RowSelectingEventArgs<HiCoSwc> args)
      {
         var data = args.Data;
         SelectedSwc = data;
      }
public async void GetSelectedSwcPartRow(RowSelectEventArgs<HiCoSwc> args)
      {
         var data = args.Data;
         SelectedSwc = data;
         var temp = await controlHiCoSwcChildren.GetSelectedRecords();
         SelectedSwc = temp.LastOrDefault();
          ...
      }


- TreeGrid: if I want to get the selected records in the row selecting event with "treegridcontro.GetSelectedRecords()" the method returns null.
Code:
methods similar like Grid example!
<SfTreeGrid @ref="treeGridHiCoSwcChildren" ID="targetSwc" DataSource="@HiCoSwcChildrenCollection" AllowSelection="true" TValue="HiCoSwc" ParentIdMapping="@nameof(HiCoSwc.ParentID)" IdMapping="@nameof(HiCoSwc.ID)" TreeColumnIndex="2" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Delete", "Edit", "Cancel" })" ShowColumnMenu="true">
     <TreeGridEvents TValue="HiCoSwc" RowSelecting="GetSelectingSwcPartRow" RowSelected="GetSelectedSwcPartRow" />
     <TreeGridPageSettings PageSize="5" PageSizeMode="PageSizeMode.All" />
     <TreeGridSelectionSettings Type="SelectionType.Multiple" CheckboxMode="CheckboxSelectionType.ResetOnRowClick" Mode="SelectionMode.Row" PersistSelection="true" />
     <TreeGridColumns>
          <TreeGridColumn Type="ColumnType.CheckBox" Width="50" />
          <TreeGridColumn Field="@nameof(HiCoSwc.ID)" HeaderText="ID" IsPrimaryKey="true" AllowResizing="true" />
          <TreeGridColumn Field="@nameof(HiCoSwc.ParentID)" HeaderText="Parent ID" AllowResizing="true" />
          <TreeGridColumn Field="@nameof(HiCoSwc.Name)" HeaderText="Name" AllowResizing="true" />
          <TreeGridColumn Field="@nameof(HiCoSwc.TypeInformation)" HeaderText="Details" AllowResizing="true" />
     </TreeGridColumns>
<SfTreeGrid>





11 Replies

MP Manivannan Padmanaban Syncfusion Team May 28, 2020 02:20 PM UTC

Hi Bernd, 

Greetings from Syncfusion Support. 

For Grid Query: 

We are validating your query and we will update you the further details on May 29, 2020. Until then, we appreciate your patience. 

For TreeGrid Query: 
 
From the shared query, we could see that you have used the GetSelectedRecords method in rowSelecting event. The rowSelecting event will triggers before row selection occurs, due to this the GetSelectedRecords is null. So, to avoid the issue we suggest you to use GetSelectedRecords in rowSelected event of TreeGrid which triggers after a row is selected. Refer to the below code example, 

<SfTreeGrid @ref="treeGridHiCoSwcChildren" ……….> 
     <TreeGridEvents TValue="HiCoSwc" RowSelected="GetSelectedSwcPartRow" /> 
…………….. 
     <TreeGridColumns> 
……………………. 
     </TreeGridColumns> 
 </SfTreeGrid> 
  
  
  
 @code{ 
…………………….. 
  
     SfTreeGrid<HiCoSwc> treeGridHiCoSwcChildren; 
 
     public async void GetSelectedSwcPartRow(RowSelectEventArgs<HiCoSwc> args) 
     { 
      
         var temp = await this.treeGridHiCoSwcChildren.GetSelectedRecords(); 
          // do your stuff 
  
     } 
  
 } 


Also, refer to the API links below. 

Still facing an issue, please get back to us with the below details. 
  1. Share the complete Tree Grid code example.
  2. Share the video demo Or screenshot of the issue.

Provided details will help us, to resolve the reported issue as early as possible. 

Regards, 
Manivannan Padmanaban 




BP Bernd Parchmann May 29, 2020 06:11 AM UTC

Sorry, I have wrongly described TreeGrid problem! Of course the GetSelectedRecords() methods will used in the row selected method as described in the posted methods!
The row selecting event is just used because without setting the selected item in row selecting and row selected method, our details view shows the last selected item instead the current selected item. Grid and TreeView working fine with just using the row/node selected event. Is that a bug, too?


MP Manivannan Padmanaban Syncfusion Team May 29, 2020 07:05 AM UTC

Hi Bernd, 

Thanks for the update. 

For Grid Query: 

We have validated your query with the provided information and checked the reported problem at our end. We could not reproduce the reported problem using the RowSelected event. Find the below code snippets for your reference.  
 
  
<SfGrid @ref="DefaultGrid" AllowPaging="true" DataSource="@Orders" AllowSorting="true"AllowSelection="true"  
        AllowFiltering="true">  
    <GridEvents RowSelected="RowSelectHandler" RowDeselected="RowDeselectHandler" TValue="Order"></GridEvents>  
    <GridEditSettings AllowEditing="true" AllowDeleting="true"></GridEditSettings>  
    <GridSelectionSettings EnableToggle="true" PersistSelection="true"></GridSelectionSettings>  
    <GridColumns>  
        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" IsPrimaryKey="true"TextAlign="@TextAlign.Center" Width="80"></GridColumn>  
        . . .  
        <GridColumn Type="ColumnType.CheckBox" Width="40"></GridColumn>  
    </GridColumns>  
</SfGrid>  
  
  
@code{  
    SfGrid<Order> DefaultGrid;  
    . . .  
    public async void RowSelectHandler(RowSelectEventArgs<Order> args)  
    {  
  
        //all the selected records are getting properly  
        var SelectedRecords = await DefaultGrid.GetSelectedRecords();  
  
        var RowCountSelected = SelectedRecords.Count();  
    }  
    public async void RowDeselectHandler(RowDeselectEventArgs<Order> args)  
    {  
        //RowDeselected – it will show the remaining selected records while deselecting(deselected one in not countable)  
        var SelectedRecords = await DefaultGrid.GetSelectedRecords();  
  
        var RowCountSelected = SelectedRecords.Count();  
    }  
}  
 
If you want to get all the selected records before deselecting, then we suggest you to get the records using RowDeselecting event. TheRowDeseleted event will trigger after the last record deselected.  
 
Reference:   
 
Also, we are quite unclear about your latest query. So, kindly get back to us with the below details. 
  1. Share the screenshot Or video demonstration of the issue.
  2. Share the complete code example.
  3. Confirm whether are you facing the problem only with treeview and grid control Or share the control details.

Regards, 
Manivannan Padmanaban 



BP Bernd Parchmann May 29, 2020 07:54 AM UTC

Hi again,

I have attached a file with our controls and code behind.

I have changed the code according your example:

- Now the Grid is working fine :-) (selected item and selected items)
- But the TreeGrid isnt working:
     o selected items count: 0
     o selected item: null; just if I select one row with click on the row (not the checkbox) the selected item is set correctly
     o and if I select a node and then select the root of the tree I got this error (console output):
    syncfusion-blazor.min.js:10 Uncaught TypeError: Cannot read property 'parentItem' of undefined
    at e.refreshToolbar (syncfusion-blazor.min.js:10)
    at e.blazorCallback (syncfusion-blazor.min.js:10)
    at e.notify (syncfusion-blazor.min.js:10)
    at t.notify (syncfusion-blazor.min.js:10)
    at t.grid.rowSelected (syncfusion-blazor.min.js:10)
    at e.blazorCallback (syncfusion-blazor.min.js:10)
    at e.notify (syncfusion-blazor.min.js:10)
    at t.e.trigger (syncfusion-blazor.min.js:10)
    at e.onActionComplete (syncfusion-blazor.min.js:10)
    at h (syncfusion-blazor.min.js:10)


Attachment: Snippet_fedf531f.zip


BP Bernd Parchmann May 29, 2020 02:35 PM UTC

I dont know why, but sometimes the selected item just working on the first click on the row!

- First click: selected item set correctly and another controls that are using this object are refreshing correctly (ex: my details view and/or filtered grid)
- Next clicks: the next clicks does not refresh another controls and just the third/fourth/... click refreshs but just with the last (not currently) selected item!

On the last post it was working I guess and I just replaced the TreeGrid with the normal Grid to test the checkbox selection feature. And now I have this problem.


@edit
Unfortunately I have to revise my statement that everything is working with selected item and GetSelectedRecords() with the Grid! It was just luck that it was working... After some tests I have the same problems with TreeGrid. Sometimes its working, sometimes not! Sometimes the selected item (just one item selected) will not be refreshed, sometimes the selected amount is not correct (mostly the last item is missing)...


GL Gowri Loganathan Syncfusion Team June 1, 2020 10:51 AM UTC

Hi Bernd, 

Thanks  for the update. 

We have analysed your reported issue at our end and we are unable to reproduce the reported issue in treegrid. We are able to get the selected records count with the rowselected event of treegrid. Please refer to the below code snippet and screenshot 
 
Code snippet 
 
…………………. 
<SfTreeGrid @ref="treeGridHiCoSwcChildren" ID="targetSwc" DataSource="@HiCoSwcChildrenCollection" AllowSelection="true" TValue="HiCoSwc" ParentIdMapping="@nameof(HiCoSwc.ParentID)> 
    ………………………….. 
</SfTreeGrid> 
 
……………………….. 
@code{  
            SfTreeGrid<HiCoSwc> treeGridHiCoSwcChildren;            
 
            public async void GetSelectedRow(RowSelectEventArgs<HiCoSwc> args) 
            { 
                var temp = await treeGridHiCoSwcChildren.GetSelectedRecords(); // store the selected records in a variable here 
                Console.Write("#### selected items: "); //show the selected records count here 
                Console.WriteLine(temp.Count); // get the selected records count here 
            } } 

 

We have prepared a client side blazor sample in treegrid kindly refer the below link, 

Still facing issues, please get back to us with the below requirements to proceed further on this issue. 
1.Kindly share the video demonstrating the reported issue. 
2.Share us the issue reproducible sample Or reproduce the issue in the attached sample. 
 
Regards, 
Gowri V L 
 



BP Bernd Parchmann June 4, 2020 11:44 AM UTC

Hi,
sry for the delay, I have done multiple tests and had an regional off day.

After my tests I found out:
- selecting multiple rows is working. but! just if I dont use the row selecting event!
- selecting a row should show the details in another control. woking just if I use the row selecting event. save the selected row in a property just with row selected event is not enough/not working!
- but if I'm using the row selecting event the count of selected items is without the last clicked row

So it seems that the Grid currently cannot meet this to requirements at the same time?


MP Manivannan Padmanaban Syncfusion Team June 5, 2020 11:06 AM UTC

Hi Bernd, 

Kindly get back to us with the requested details(refer previous update) along with below detail, which will help us to proceed further on your query. 

  1. Confirm whether are you facing an issue in DataGrid Or TreeGrid.

Regards, 
Manivannan Padmanaban. 



BP Bernd Parchmann June 5, 2020 03:18 PM UTC

My last post relates to SfGrid!

I have created two videos to demonstrate the behaviours:
- Grid1 video: without row selecting event -> checkbox selection is working but selected item shows the last - not the current - selected item
- Grid2 video: with row selecting event -> checkbox selection shows the wrong amount of selected items: without the last selection - but the selected item is showed correctly

Next week I will send a video of the TreeGrid behaviour

Hope this videos can help to find the issue...

Attachment: Videos_71d9db6.zip


VN Vignesh Natarajan Syncfusion Team June 10, 2020 02:29 PM UTC

Hi Bernd,  
 
Thanks for sharing the video demonstration.  
 
Query: “without row selecting event -> checkbox selection is working but selected item shows the last - not the current - selected item 
 
We have prepared a sample as per your suggestion using our latest version Nuget package (18.1.0.56) and we are not able to reproduce the reported issue (selecteditem show the last item, not current item) at our end. We are able to get the current selected record details properly in RowSelected event along with total selected record count. We are not able to reproduce the reported issue at our end. Kindly download the sample from below  
 
 
After referring the provided sample, if you are still facing the issue. Kindly share the issue reproducible sample or try to reproduce the reported issue in provided. It will be helpful for us to validate the reported issue at our end.  
 
Query2: “with row selecting event -> checkbox selection shows the wrong amount of selected items: without the last selection - but the selected item is showed correctly 
 
We are able to reproduce the reported issue at our end (GetSelectedRecords count is returned wrongly with RowSelecting event). Currently we are validating your query. We will update you the further details by 12th June 2020.  
 
Till then we appreciate your patience.  
 
Regards, 
Vignesh Natarajan 



VN Vignesh Natarajan Syncfusion Team June 12, 2020 02:36 PM UTC

Hi Bernd,  
 
Thanks for patience.  
 
Query: “with row selecting event -> checkbox selection shows the wrong amount of selected items” 
 
We have validated the defect you have initiated with us and confirmed it is a bug. Thank you for taking the time to report this issue “Checkbox selection is not working properly with Selection events in ClientSide Blazor application” and helping us improve our product. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the defect fix in 2020 Volume 2 release which is expected to be rolled out in the month end of June 2020.  
  
You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.  
  
  
Till then we appreciate your patience.   
 
Regards, 
Vignesh Natarajan 
 


Loader.
Up arrow icon