Primefaces Mobile - DataTable - select row, before event taphold occurs

350 Views Asked by At

I have a problem in PrimeFaces Mobile with the DataTable and the event taphold.

problem:

  • If I use the event taphold in a datatable, the event occurs, before the row can be selected.

the desired behaviour:

  • the click or finger touch selects the row (visually through a different background color for the row too). The event taphold occurs, if I press long enough, additionally.

first ideas, to solve the problem

  • I think, the problem is, that for row selection the .mouseup()-event is responsible and not the mousedown()-event for example. So, I have to change the event, to select the row, before the taphold-event occurs. But I don't know how.

current source code:

<p:dataTable id="music_songs" var="music" value="#{musicPlayerBean.musicSongs}" selectionMode="single" 
         selection="#{musicPlayerBean.selectedMusicSong}" rowKey="#{music.id}" style="background: white;"
         paginator="true" rows="25" tableStyleClass="ui-table-columntoggle" emptyMessage="keine Musik-Songs vorhanden">

     <p:ajax event="taphold" oncomplete="alert('Hallo');"/>

     <p:column headerText="Interpret" priority="1" sortBy="#{music.interpret}">
         <h:outputText value="#{music.interpret}"/>
     </p:column>

     <p:column headerText="Titel" priority="1" sortBy="#{music.title}">
         <h:outputText value="#{music.title}" />
     </p:column>

     <p:column headerText="Dauer" priority="2" sortBy="#{music.duration}">
         <h:outputText value="#{music.durationAsString}"/>
     </p:column>

     <p:column headerText="Album" priority="2" sortBy="#{music.album}">
         <h:outputText value="#{music.album}"/>
     </p:column>
 </p:dataTable>

Examples for mobile data tables on PrimeFaces-Website

Versions:

  • JSF 2.2
  • Java 1.7
  • Glassfish 4
  • PrimeFaces 5.2
0

There are 0 best solutions below