Primefaces: On click on div inside p:column doesn´t call rowSelect method

Question

In my p:column I have several divs with text, if I click on the text it doesn´t select the row and also doesn´t call rowSelect event.

Example:

...
<p:column>
         text1
    <div>text2</div>
<p:column>
...

I can click on text1 but not on text2. Where is the problem?

Answer 1

The problem is that div overwrite onclick event of column. I had that problem, my solution was overrite that event on div with functions like theses:

XHTML:

<p:datatable ..(properties)... widgetVar="dt" rowIndexVar"rowIndex" ...>
.......
<p:column>
   <div onclick="selectCurrentRow(dt,#{rowIndex});" > hola </div>
</p:column>
.......
<p:datatable/>

JS:

function selectCurrentRow_paginator(table,index){
table.unselectAllRows();
table.selectRow(index-(table.paginator.cfg.page*table.paginator.cfg.rows) ,false);

}

function selectCurrentRow(table,index){
table.unselectAllRows();
table.selectRow(index ,false);
}

if JS say dt is not defined just surround wingetVar name with PF() function like this:

<div onclick="selectCurrentRow(PF('dt'),#{rowIndex});" > hola </div>

Also this solution help with oncontextmenu event too:

<div oncontextmenu="selectCurrentRow(PF('dt'),#{rowIndex});" onclick="selectCurrentRow(PF('dt'),#{rowIndex});" > hola </div>