DataTable - Instant Row Selection

Instant row selection, dblclick selection and unselection is implemented using ajax behaviors.

Select a row to display a message
ModelYearManufacturerColor
40c2acd7 2006 Mercedes Blue
a38f072e 2007 Chrysler Blue
251573d4 1971 Mercedes Orange
14af70f2 1993 Renault White
ef44d760 2005 Volvo White
7dfd3b8c 1990 Chrysler Red
1f159796 1975 BMW Yellow
97e3e369 1963 Volkswagen Blue
b9cd57f4 1982 Renault Blue
ad2542a0 1995 Volvo Brown
Car Detail
Model:
Year:
Manufacturer:
Color:

Source

<h:form id="form">

    <p:growl id="growl" showDetail="true"/>

    <p:dataTable id="cars" var="car" value="#{tableBean.mediumCarsModel}" paginator="true" rows="10"
                 selection="#{tableBean.selectedCar}" selectionMode="single">

        <p:ajax event="rowSelect" listener="#{tableBean.onRowSelect}" 
                    update=":form:display :form:growl" oncomplete="PF('carDialog').show()" />
        <p:ajax event="rowUnselect" listener="#{tableBean.onRowUnselect}" update=":form:growl"/>

        <f:facet name="header">
            Select a row to display a message
        </f:facet>

        <p:column headerText="Model">
            #{car.model}
        </p:column>

        <p:column headerText="Year">
            #{car.year}
        </p:column>

        <p:column headerText="Manufacturer" >
            #{car.manufacturer}
        </p:column>

        <p:column headerText="Color">
            #{car.color}
        </p:column>
    </p:dataTable>

    <p:dialog id="dialog" header="Car Detail" widgetVar="carDialog" resizable="false"
                showEffect="fade" hideEffect="explode">

        <h:panelGrid id="display" columns="2" cellpadding="4">

            <f:facet name="header">
                <p:graphicImage value="/images/cars/#{tableBean.selectedCar.manufacturer}.jpg"/>
            </f:facet>

            <h:outputText value="Model:" />
            <h:outputText value="#{tableBean.selectedCar.model}" />

            <h:outputText value="Year:" />
            <h:outputText value="#{tableBean.selectedCar.year}" />

            <h:outputText value="Manufacturer:" />
            <h:outputText value="#{tableBean.selectedCar.manufacturer}" />

            <h:outputText value="Color:" />
            <h:outputText value="#{tableBean.selectedCar.color}" />
        </h:panelGrid>
    </p:dialog>

</h:form>