53

I am trying to find a list of all the possible values I can pass to the attribute event of the f:ajax tag.

I know that I can also pass function names from my .js files, but what I need just the ones that come with JSF.

I only know about click mouseover and keyup, but I am sure there are more. Just don't know where to find them.

Andrew Tobilko
  • 48,120
  • 14
  • 91
  • 142
javing
  • 12,307
  • 35
  • 138
  • 211

2 Answers2

118

The event attribute of <f:ajax> can hold at least all supported DOM events of the HTML element which is been generated by the Faces component in question. An easy way to find them all out is to check all on* attribues of the Faces input component of interest in the Faces tag library documentation and then remove the "on" prefix. For example, the <h:inputText> component which renders <input type="text"> lists the following on* attributes (of which I've already removed the "on" prefix so that it ultimately becomes the DOM event type name):

  • blur
  • change
  • click
  • dblclick
  • focus
  • keydown
  • keypress
  • keyup
  • mousedown
  • mousemove
  • mouseout
  • mouseover
  • mouseup
  • select

Additionally, Faces has two more special event names for EditableValueHolder and ActionSource components, the real HTML DOM event being rendered depends on the component type:

  • valueChange (will render as change on text/select inputs and as click on radio/checkbox inputs)
  • action (will render as click on command links/buttons)

The above two are the default events for the components in question.

Some Faces component libraries have additional customized event names which are generally more specialized kinds of valueChange or action events, such as PrimeFaces <p:ajax> which supports among others tabChange, itemSelect, itemUnselect, dateSelect, page, sort, filter, close, etc depending on the parent <p:xxx> component. You can find them all in the "Ajax Behavior Events" subsection of each component's chapter in PrimeFaces User's Guide.

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • This is a great information, that's what i was looking for. But now i have a little doubt. Will those events in the DOM events link, will make trouble in some browsers? I am interested the most in the events related to drag and drop and focus in and out. – javing Oct 25 '11 at 19:26
  • The standard JSF components indeed don't specify any HTML5 drag'n'drop attributes (the PrimeFaces ones for example may do). You can however find an overview of them all here: http://dev.w3.org/html5/spec/webappapis.html#event-handlers-on-elements-document-objects-and-window-objects In theory, they will be hooked as such, but you have to make sure that the HTML element which is generated by JSF really supports it. As to the focus in and out, for that you've `focus` and `blur` respectively. – BalusC Oct 25 '11 at 19:30
  • I understand. So better i make my JSF pages to be html5 so i can have those more advanced features. Thanks for the great answer. – javing Oct 26 '11 at 09:54
  • it is not completely clear to me whether you do clarify that the list you provided is comprehensive for all the components that are ajax-able but each component will support only a subset of what is there. e.g. `h:form` supports only `click, dblclick, keydown, keypress, keyup, mousedown, mousemove, mouseout, mouseover, mouseup`. it does not support `focus`, which you have listed. if you try to use it, you get a `TagException` saying: ` 'focus' is not a supported event for HtmlForm` – amphibient Dec 19 '14 at 21:59
2

I just input some value that I knew was invalid and here is the output:

'whatToInput' is not a supported event for HtmlPanelGrid. Please specify one of these supported event names: click, dblclick, keydown, keypress, keyup, mousedown, mousemove, mouseout, mouseover, mouseup.

So values you can pass to event are

  • click
  • dblclick
  • keydown
  • mousedown
  • mousemove
  • mouseover
  • mouseup
Wecherowski
  • 818
  • 11
  • 24
1392023093user
  • 1,047
  • 4
  • 21
  • 37