I’ve run into an issue where click events in a cell are not firing under a confluence of conditions:
- A custom renderer that renders some
<div>
elements in the cell -
fixedColumnsLeft
is set to 1 - The first column is resized to take up most of the table width
- Use Chrome (doesn’t happen in FireFox)
Result: Click events in the column are lost
See this JSfiddle:
https://jsfiddle.net/a438ovr1/2/
In this demo a click handler is added to the HoT table element, it has fixedColumnsLeft: 1
and a custom renderer for the first column that renders <div>${ value }</div>
.
- Click in the “name” column cells and notice that you get console log “Table click”
- Resize the “name” column to be wide enough to truncate the “description” column
- Click in the “name” column cells and notice that the console log no longer reports the click
- If you remove
fixedColumnsLeft: 1
then at (3) above the click events are still captured - If you change the renderer for the name column to set
textContent
instead ofinnerHTML
, then at (3) above the click events are still captured - Only happens in Chrome, if you use FireFox then at (3) above the click events are still captured
It seems that under the conditions described above the click handler coming from a table cell is lost. I can’t track down why this is. Any help would be appreciated!