Reputation: 33
I Need to implement same thing in jsf using jsf builtin components. The problem I am not able to find the list attribute to bind the <datalist>
. Please help me how can I do that.
<input id="something" list="somethingelse"/>
<datalist id="somethingelse">
<option value="Something"></option>
<option value="Something Else"></option>
<option value="Another One"></option>
<option value="Alpha"></option>
<option value="Bravo"></option>
<option value="Charlie"></option>
<option value="Delta"></option>
<option value="Echo"></option>
<option value="Foxtrot"></option>
<option value="Gamma"></option>
</datalist>
Upvotes: 0
Views: 1829
Reputation: 12337
You can use jsf passtrough attributes for this.
<input id="something" list="somethingelse"/>
becomes
<h:inputText pt:list="somethingelse" />
So the following full example works:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:pt="http://xmlns.jcp.org/jsf/passthrough">
<h:head />
<h:body>
<h:form>
<h:inputText pt:list="somethingelse" />
<datalist id="somethingelse">
<option value="Something"></option>
<option value="Something Else"></option>
<option value="Another One"></option>
<option value="Alpha"></option>
<option value="Bravo"></option>
<option value="Charlie"></option>
<option value="Delta"></option>
<option value="Echo"></option>
<option value="Foxtrot"></option>
<option value="Gamma"></option>
</datalist>
</h:form>
</h:body>
</html>
But keep in mind that you need to have the full list of options on the client-side upfront. No easy populating from a database based on the characters that are typed.
If you are allowed to use something like PrimeFaces, its p:autoComplete
is way more powerful
Upvotes: 2