1 Reply Latest reply on Nov 17, 2008 10:53 AM by ilya_shaikovsky

    dataTable with tooTip

    john_hedden

      I know from the live examples that its possible to attach the toolTip to a column within a row but is it possible to attach the toolTip to lets say a onRowMouseOver on the row? Ive tried various times with no luck and figured Id ask if it was even possible before I proceeded any further.

        • 1. Re: dataTable with tooTip
          ilya_shaikovsky

           

           <h:form>
           <rich:dataTable value="#{toolTipData.vehicles}" width="400"
           var="vehicle" rowKeyVar="row">
           <f:facet name="header">
           <h:outputText value="Car Store"/>
           </f:facet>
           <rich:column>
           <f:facet name="header">
           <h:outputText value="##" />
           </f:facet>
           <h:outputText value="#{row+1}" />
           </rich:column>
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Make" />
           </f:facet>
           <a4j:outputPanel layout="block">
           <rich:toolTip direction="top-right" mode="ajax" showDelay="500"
           styleClass="tooltip" layout="block" id="tooltip" attached="false">
           <a4j:actionparam name="key" value="#{row}"
           assignTo="#{toolTipData.currentVehicleIndex}" />
          
           <h:panelGrid columns="4">
           <f:facet name="header">
           <h:outputText value="Vehicle details:" />
           </f:facet>
           <h:outputText value="make:" />
           <h:outputText value="#{vehicle.make}" styleClass="tooltipData" />
           <h:outputText value="model:" />
           <h:outputText value="#{vehicle.model}" styleClass="tooltipData" />
           <h:outputText value="year:" />
           <h:outputText value="#{vehicle.year}" styleClass="tooltipData" />
           <h:outputText value="milage:" />
           <h:outputText value="#{vehicle.milage}" styleClass="tooltipData" />
           <h:outputText value="zip:" />
           <h:outputText value="#{vehicle.zip}" styleClass="tooltipData" />
           <h:outputText value="listed:" />
           <h:outputText value="#{vehicle.listed}" styleClass="tooltipData">
           <f:convertDateTime dateStyle="short" />
           </h:outputText>
           <f:facet name="footer">
           <h:panelGroup>
           <h:outputText value="vin: " />
           <h:outputText value="#{vehicle.vin}" styleClass="tooltipData" />
           </h:panelGroup>
           </f:facet>
          
           </h:panelGrid>
           </rich:toolTip>
           <h:outputText id="make" value="#{vehicle.make}"/>
           </a4j:outputPanel>
           </rich:column>
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Model" />
           </f:facet>
           <h:outputText value="#{vehicle.model}" />
           </rich:column>
           <rich:column>
           <f:facet name="header">
           <h:outputText value="Year" />
           </f:facet>
           <h:outputText value="#{vehicle.year}" />
           </rich:column>
           <rich:componentControl event="onRowMouseOver" for="tooltip" operation="show"/>
           <rich:componentControl event="onRowMouseOut" for="tooltip" operation="hide"/>
           </rich:dataTable>
           </h:form>
          
          



          this works fine for me.