DataTable - Instant Row Selection

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

Select a row to display a message
pp12345pp
ModelYearManufacturerColor
062a09c4 1970 Volvo Red
aeae4019 2008 Mercedes Green
8186e7f0 1968 Volvo Green
da1a6f07 1985 Ferrari Blue
79f5a3a1 1993 Ferrari Blue
90e23cb8 1986 Renault White
64619bbc 1993 Ferrari Green
310df342 2001 Audi Yellow
c115c5dc 1976 Ferrari Orange
c33ec9c1 1961 Mercedes Red
pp12345pp
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="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>