Row selection with command column and checkbox

[Cyril Ovely]

Hi Team,

I am working with row selection. I am having requirement where grid has checkbox and command column, I only want to select/deselect row only on the click of checkbox.

If a user clicks anywhere else in the row, I just want to get rowData and disable rowselection.

Requirement is to have three separate clicks 

1. Get List of rows on click of "Get Selected Rows" Button, we want to select rows only on checkbox
   
2. Get row data on click of other columns and disable row selection
3. Capture clicks on command column and disable row selection

Please refer and suggest changes below attached example
Thanks & Regards,
Cyril Ovely

Attachment: rowselectionsyncfusion_4e65d68b.zip

[Pavithra Subramaniyam]

Hi Cyril Ovely,

Thanks for contacting Syncfusion support.

Query#1: Get List of rows on click of "Get Selected Rows" Button, we want to select rows only on checkbox

You can achieve your requirement by setting the “selectionSettings.checkboxOnly” property as true which provides an option to select the rows only when clicking the checkboxes. Also, you can get the selected records using the “getSelectedRecords” method as in your sample.

      <ejs-grid ref="grid" :dataSource="data" :selectionSettings="selectionSettings" :commandClick="commandClick">

</ejs-grid>

 

selectionSettings: { checkboxOnly: true },

 

 

https://ej2.syncfusion.com/vue/documentation/api/grid/selectionSettings/#checkboxonly

Query#2: Get row data on click of other columns and disable row selection

You can get the clicked row information using the “recordClick” event without selecting the row.

recordClick: function(e) {

  // you can make the condition based on the clicked cell using the ‘e.target’ value here

  console.log(e.rowData)

},

 

https://ej2.syncfusion.com/vue/documentation/api/grid/#recordclick

Query#3: Capture clicks on command column and disable row selection

You can capture the command column click inside the “commandClick” event handler.

Please get back to us if you need further assistance on this.

Regards,

Pavithra S