Open the LOV of af:inputListOfValues with a double click
- by frank.nimphius
To open the LOV popup of an af:inputListOfValues component in ADF Faces, you either click the magnifier icon to the right of the input field or tab onto the icon and press the Enter key. If you want to open the same dialog in response to a user double click into the LOV input field, JavaScript is a friend. For this solution, I assume you created an editable table or input form that is based on a View Object that contains at least one attribute that has a model driven list of values defined. The Default List Type is should be set to Input Text with List of Values so that when the form or table gets created, the attribute is rendered by the af:inputListOfValues component. To implement the use case, drag a Client Listener component from the Operations accordion in the Component Palette and drop it onto the af:inputListOfValues component in the page. In the opened Insert Client Listener dialog, define the Method as handleLovOnDblclickand choose dblClick in the select list for the Type attribute. Add the following code snippet to the page source directly below the af:document tag. <af:document id="d1"> <af:resource type="javascript"> function handleLovOnDblclick(evt){ var lovComp = evt.getSource(); if (lovComp instanceof AdfRichInputListOfValues && lovComp.getReadOnly()==false){ AdfLaunchPopupEvent.queue(lovComp,true); } } </af:resource> The JavaScript function is called whenever the user clicks into the LOV field. It gets the source component reference from the event object that is passed into the function and verifies the LOV component is not read only. It then queues the launch event for the LOV popup to open. The page source for the LOV component is shown below: <af:inputListOfValues id="departmentIdId" … > <f:validator binding="…"/> … <af:clientListener method="handleLovOnDblclick" type="dblClick"/> </af:inputListOfValues>
