olifolkerd / tabulator

Interactive Tables and Data Grids for JavaScript
http://tabulator.info
MIT License
6.6k stars 811 forks source link

Tree RowClick event is not fired upon certain column setup #4434

Open jaguarxii opened 6 months ago

jaguarxii commented 6 months ago

Describe the bug Tree RowClick event is not fired upon certain column setup

Tabulator Info

Working Example Sample

To Reproduce A step by step guide to recreate the issue in your JS Fiddle or Codepen:

  1. Setup a tree grid with 1 selectable rows
  2. Setup a column (first column) of a tree grid with a NON-Editable INPUT editor
  3. Setup up the "rowClick" event on the tree table
  4. Run the sample
  5. The first column of the grid does not fire the rowClick event while clicking on its contents, it only works while clicking in surrounding pixel of the content
  6. Any other column fires the "rowClick" event, and selects the row
  7. Adding an "action" button to edit the cell of step 2, fires the "rowClick" event and selects the row

Expected behavior All columns should fire the "rowClick" event of the table while clicking on its contents, to select the current row

Desktop (please complete the following information):

Smartphone (please complete the following information):

damacchifico commented 3 months ago

Same issue. The row itself can fire the rowClick event but the cell doesn't bubbles up the click to it if it has an editor but the column is not editable.

jaguarxii commented 2 months ago

I updated the codepen with a workaround that works for my use case, by setting the "cellEditing" event to manage the row selection.

table.on("cellEditing", function(cell){
  //e - the click event object
  //row - row component
  var selectedRow = table.getSelectedData();
  if(selectedRow.length != 0){
    if(selectedRow[0].id != cell.getRow().getData().id){
      table.deselectRow();
      table.selectRow(cell.getRow().getData().id);
    }
  }
  else{
    table.selectRow(cell.getRow().getData().id);
  }
  cell.edit(true);
  //console.log("rowClick: " + cell.getData().name);
});