PrimeFaces-6.1 Dblclick Event

Dec 4, 2017   #Java  #JavaEE  #PrimeFaces 

今作っているWebアプリでリンクをダブルクリックで動作させるという要求が出たので、 どうやって実現するのか調べてみました。

通常のリンクを実装してみる

PrimeFacesの commandLink コンポーネントでリンクを実装します。

<p:commandLink value="Single Click" action="#{bean.onClick}" />

ダブルクリックで動作するリンクを実装してみる

commandLink コンポーネントで実装すると、 onclick イベントで動作するようにレンダリングされてしまうので、 link コンポーネントで実装します。 href を指定するのがコツです。 link コンポーネントでは dblclick イベントだけを発生させ、実際の呼び出しは remoteCommand コンポーネントで行います。

<p:link href="#" value="Double Click" ondblclick="dblClickEvent()" />
<p:remoteCommand name="dblClickEvent" action="#{bean.onClick}" />