<a:form> <a:growl id="msgs" showDetail="true" /> <h3 style="margin-top: 0">Basic OrderList</h3> <a:orderList value="#{orderListView.cities}" var="city" controlsLocation="none" itemLabel="#{city}" itemValue="#{city}" /> <a:commandButton value="Submit" update="displayCities" oncomplete="PF('cityDialog').show()" style="margin-top:5px" /> <h3>Pojo Support with Clip Effect, Captions, Custom Content, Reorder Controls, Events and Responsive</h3> <a:orderList value="#{orderListView.themes}" var="theme" itemValue="#{theme}" converter="theme" controlsLocation="left" responsive="true"> <a:ajax event="select" listener="#{orderListView.onSelect}" update="msgs"/> <a:ajax event="unselect" listener="#{orderListView.onUnselect}" update="msgs"/> <a:ajax event="reorder" listener="#{orderListView.onReorder}" update="msgs"/> <f:facet name="caption">Available</f:facet> <a:column style="width:32px"> <h:outputText styleClass="ui-theme ui-theme-#{theme.name}" /> </a:column> <a:column> <h:outputText value="#{theme.displayName}" /> </a:column> </a:orderList> <a:commandButton value="Submit" update="displayThemes" oncomplete="PF('themesDialog').show()" style="margin-top:5px" /> <a:dialog modal="true" showEffect="fade" hideEffect="fade" widgetVar="cityDialog" header="Cities" width="200"> <a:dataList id="displayCities" value="#{orderListView.cities}" var="city"> <h:outputText value="#{city}" /> </a:dataList> </a:dialog> <a:dialog modal="true" showEffect="fade" hideEffect="fade" widgetVar="themesDialog" header="Themes" width="200" id="dlgThemes"> <h:panelGrid id="displayThemes" columns="2"> <ui:repeat value="#{orderListView.themes}" var="theme"> <h:outputText value="#{theme.displayName}" style="margin-right:5px" /> </ui:repeat> </h:panelGrid> </a:dialog> </a:form>
package com.jarch.showcase.view.data; import java.util.ArrayList; import java.util.List; import javax.annotation.PostConstruct; import javax.faces.application.FacesMessage; import javax.faces.bean.ManagedBean; import javax.faces.bean.ManagedProperty; import javax.faces.context.FacesContext; import org.primefaces.event.SelectEvent; import org.primefaces.event.UnselectEvent; import org.primefaces.showcase.service.ThemeService; import org.primefaces.showcase.domain.Theme; @ManagedBean public class OrderListView { @ManagedProperty("#{themeService}") private ThemeService service; private List<String> cities; private List<Theme> themes; @PostConstruct public void init() { //Cities cities = new ArrayList<String>(); cities.add("San Francisco"); cities.add("London"); cities.add("Paris"); cities.add("Istanbul"); cities.add("Berlin"); cities.add("Barcelona"); cities.add("Rome"); //Themes themes = service.getThemes().subList(0, 6); } public ThemeService getService() { return service; } public void setService(ThemeService service) { this.service = service; } public List<String> getCities() { return cities; } public void setCities(List<String> cities) { this.cities = cities; } public List<Theme> getThemes() { return themes; } public void setThemes(List<Theme> themes) { this.themes = themes; } public void onSelect(SelectEvent event) { FacesContext context = FacesContext.getCurrentInstance(); context.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Item Selected", event.getObject().toString())); } public void onUnselect(UnselectEvent event) { FacesContext context = FacesContext.getCurrentInstance(); context.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Item Unselected", event.getObject().toString())); } public void onReorder() { FacesContext context = FacesContext.getCurrentInstance(); context.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "List Reordered", null)); } }