PrimeFaces SelectOneMenu

SelectOneMenu is a member of new PrimeFaces Form Controls. It extends standard selectOneMenu component with theme integration, various animations and custom content display. Let me focus on custom content display which is my favorite feature. Suppose you have a custom domain object like Player and you want to display detailed information about Player on overlay menu. Here we go;


public class PlayerBean {

private Player selectedPlayer;

private List<Player> availablePlayers;

//getters and setters

}

<p:selectOneMenu value="#{playerBean.selectedPlayer}"
         converter="player" height="250" effect="fade" var="p">
         <f:selectItem itemLabel="Select One" itemValue="" />
         <f:selectItems value="#{playerBean.players}" var="player" itemLabel="#{player.name}" itemValue="#{player}"/>

         <p:column>
           <p:graphicImage value="/images/barca/#{p.photo}" width="40" height="50"/>
         </p:column>

         <p:column>
           #{p.name} - #{p.number}
         </p:column>
</p:selectOneMenu>

You can customize the overlay content by using p:column components, output of this example based on different themes would be;

Demos

Checkout Labs Showcase to see this example live.

5 Responses to PrimeFaces SelectOneMenu

  1. Oleg says:

    Cool. Finally, we can use the custom content in SelectOneMenu! It’s very handy, I will use it as theme switcher with theme images and name.

  2. bitec says:

    perfect as usual! Pitty, that this didn’t get into 2.2😦

  3. Omos says:

    Will this work with Version 2.2 final?

  4. @Omos, no, it is for 3.0.

%d bloggers like this: