Primefaces provides incredible amount of new components that adhered the different aspect of Ajax. One of the component AutoComplete is most widely used with the web applications. That component is AutoComplete which is a core primefaces component used for providing the user prompt suggestions while the input is being typed into the input box.
This tutorial should clarify the AutoComplete component once it filled using completeMethod strategy. In the completeMethod strategy, suggestions loaded by calling the server side completeMethod that takes a single string parameter which is the text entered.
- Read : PrimeFaces Tutorials
1. AutoComplete Tag Info
2. AutoComplete Attributes
3. Managed Bean
AutoComplete.java
[code lang=”java”]
package net.javabeat.primefaces;
import java.util.ArrayList;
import java.util.List;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
@ManagedBean
@SessionScoped
public class AutoComplete {
private String message;
public AutoComplete (){
}
public List<String> complete(String query){
List<String> queries = new ArrayList<String>();
for(int i = 0 ; i < 15 ; i++){
queries.add(query+i);
}
return queries;
}
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
}
[/code]
4. The View
index.xhtml
[code lang=”xml”]
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<script name="jquery/jquery.js" library="primefaces"></script>
</h:head>
<f:view>
<h:form prependId="false">
<h:outputText value="Type JavaBeat :"/>
<p:autoComplete value="#{autoComplete.message}" completeMethod="#{autoComplete.complete}"></p:autoComplete>
</h:form>
</f:view>
</html>
[/code]
5. Primefaces AutoComplete + completeMethod Demo
The below snapshot shows you the using of autoComplete primefaces component for rendering a suggestions for the end user that tries to type message.
[wpdm_file id=64]
Leave a Reply