rich:toolTip question

[kevcpu411]

does anyone understand what makes the example, listed below, on the richfaces examples page work? I am thoroughly confused by this. I would think an action or actionlistener would need to be added to the toolTip in order to make it pull its data whenever the dataTable entries were moused over. This does not appear to be the case. The action/actionlistener seems to be deprecated for the tooltip. In a nutshell, I just want to be able to populate the tooltip at the moment a mouseover occurs. In my attempt to achieve this task, the default content appears but the getters for the bean are never reached on the server side. Could someone please explain this to me. It seems like you are forced to pre-populate the tooltip in the case of a tooltip nested within a dataTable, which is the way I would like to use it. I really need help on this.

<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="300"
 styleClass="tooltip" layout="block">
 <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:dataTable>
 </h:form>

[ilya_shaikovsky]

Sorry In this code really action listener does nothing and seems remained as development artifact. Data was fetched on initial table rendering.

Now I updated the sample and put to svn(You could check). In sample now the way to load the data on real tooltip request. (actionparam used to set the current row for tooltip and its action listener called to fill the data object used by tooltip)

the code to look through without svn checkout:

 <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="300"
 styleClass="tooltip" layout="block">
 <f:setPropertyActionListener value="#{vehicle}" target="#{toolTipData.vehicle}" />
 <a4j:actionparam name="key" value="#{row}"
 assignTo="#{toolTipData.currentVehicleIndex}" actionListener="#{toolTipData.fillCurrent}"/>
 <h:panelGrid columns="4">
 <f:facet name="header">
 <h:outputText value="Vehicle details:" />
 </f:facet>
 <h:outputText value="make:" />
 <h:outputText value="#{toolTipData.vehicle.make}" styleClass="tooltipData" />
 <h:outputText value="model:" />
 <h:outputText value="#{toolTipData.vehicle.model}" styleClass="tooltipData" />
 <h:outputText value="year:" />
 <h:outputText value="#{toolTipData.vehicle.year}" styleClass="tooltipData" />
 <h:outputText value="milage:" />
 <h:outputText value="#{toolTipData.vehicle.milage}" styleClass="tooltipData" />
 <h:outputText value="zip:" />
 <h:outputText value="#{toolTipData.vehicle.zip}" styleClass="tooltipData" />
 <h:outputText value="listed:" />
 <h:outputText value="#{toolTipData.vehicle.listed}" styleClass="tooltipData">
 <f:convertDateTime dateStyle="short" />
 </h:outputText>
 <f:facet name="footer">
 <h:panelGroup>
 <h:outputText value="vin: " />
 <h:outputText value="#{toolTipData.vehicle.vin}" styleClass="tooltipData" />
 </h:panelGroup>
 </f:facet>

 </h:panelGrid>
 </rich:toolTip>
 <h:outputText id="make" value="#{vehicle.make}"/>
 </a4j:outputPanel>
 </rich:column>
...

and actionListener method pretty simple in this case:

 private int currentVehicleIndex = -1;
 private Vehicle vehicle = null;

 public void fillCurrent(ActionEvent event) {
 vehicle = (Vehicle)vehicles.get(currentVehicleIndex);
 }

So you could easily fetch any additional data for tooltip in this way.

[ilya_shaikovsky]

sorry forgot to remove

<f:setPropertyActionListener value="#{vehicle}" target="#{toolTipData.vehicle}" />

It's not nesessary. Just remove it. And I'll recommit.

[kevcpu411]

Let me first say thanks for your time and effort. I received an error for the f:setPropertyActionListener. The error indicated that it needs to be nested within a component that handles ActionSource. Do I need this section of code? Also, I tried it without the f:setPropertyActionListener and the actionListener never gets called. Am I missing something? Do I need to somehow associate the actionListener to the mouseover that occurs?

"ilya_shaikovsky" wrote:
Sorry In this code really action listener does nothing and seems remained as development artifact. Data was fetched on initial table rendering.

Now I updated the sample and put to svn(You could check). In sample now the way to load the data on real tooltip request. (actionparam used to set the current row for tooltip and its action listener called to fill the data object used by tooltip)

the code to look through without svn checkout:

 <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="300"
 styleClass="tooltip" layout="block">
 <f:setPropertyActionListener value="#{vehicle}" target="#{toolTipData.vehicle}" />
 <a4j:actionparam name="key" value="#{row}"
 assignTo="#{toolTipData.currentVehicleIndex}" actionListener="#{toolTipData.fillCurrent}"/>
 <h:panelGrid columns="4">
 <f:facet name="header">
 <h:outputText value="Vehicle details:" />
 </f:facet>
 <h:outputText value="make:" />
 <h:outputText value="#{toolTipData.vehicle.make}" styleClass="tooltipData" />
 <h:outputText value="model:" />
 <h:outputText value="#{toolTipData.vehicle.model}" styleClass="tooltipData" />
 <h:outputText value="year:" />
 <h:outputText value="#{toolTipData.vehicle.year}" styleClass="tooltipData" />
 <h:outputText value="milage:" />
 <h:outputText value="#{toolTipData.vehicle.milage}" styleClass="tooltipData" />
 <h:outputText value="zip:" />
 <h:outputText value="#{toolTipData.vehicle.zip}" styleClass="tooltipData" />
 <h:outputText value="listed:" />
 <h:outputText value="#{toolTipData.vehicle.listed}" styleClass="tooltipData">
 <f:convertDateTime dateStyle="short" />
 </h:outputText>
 <f:facet name="footer">
 <h:panelGroup>
 <h:outputText value="vin: " />
 <h:outputText value="#{toolTipData.vehicle.vin}" styleClass="tooltipData" />
 </h:panelGroup>
 </f:facet>

 </h:panelGrid>
 </rich:toolTip>
 <h:outputText id="make" value="#{vehicle.make}"/>
 </a4j:outputPanel>
 </rich:column>
...

and actionListener method pretty simple in this case:

 private int currentVehicleIndex = -1;
 private Vehicle vehicle = null;

 public void fillCurrent(ActionEvent event) {
 vehicle = (Vehicle)vehicles.get(currentVehicleIndex);
 }

So you could easily fetch any additional data for tooltip in this way.

[ilya_shaikovsky]

which version you using? I've checked under 3.3.0 - 3.3.1

[ilya_shaikovsky]

B.t.w. we checked and it could be used only on 3.2.2 and later

[kevcpu411]

I am currently downloading version 3.3.0. I had 3.2.1. I should you more information shortly.

[kevcpu411]

It appears to be hitting the actionListener but the getter for the object is never called. I would think it would call after the actionListener resets the object. Is my thinking off on this?

[kevcpu411]

After thinking about it some more, it seems like something would have to trigger a reRender of the dataTable contained within the toolTip. If this is the case, do I need to include something with the a4j:actionparam?

"kevcpu411" wrote:
It appears to be hitting the actionListener but the getter for the object is never called. I would think it would call after the actionListener resets the object. Is my thinking off on this?

[ilya_shaikovsky]

No.. tooltip should fetch the data without any additional reRendering. As you could see from my code above.

[kevcpu411]

With that said, is the tooltip populated as the dataTable is created or after you perform the mouseover? When I tried it the way you have listed it never called the getter after the actionListener, which I thought would happen before the tooltip actually rendered. I would think that the getter would be called each time you performed a new mouseover. How is the tooltip populating in your example?

[ilya_shaikovsky]

in the example from current demosite code - tooltip repopulated after mouseover.

[kevcpu411]

Lets take the vehicle example on the richfaces demo site. When you mouseover the cars make, the tooltip displays. The first point of confusion, they have a var named vehicle attached to the datatable. How is this being populated with the currently selected record upon mouseover? I initially thought a getter was being called to complete the population. It seems like this is not the case. Also, where can I see the ToolTipData bean. This might help as well. The only thing I see from the demo is the page.

[kevcpu411]

okay, I found the code for the class, ToolTipData. When is getCurrentVehicle called? How does ajax know to call getCurrentVehicle? It seems as if this the place where the current record is coming from? Is this correct?

"kevcpu411" wrote:
Lets take the vehicle example on the richfaces demo site. When you mouseover the cars make, the tooltip displays. The first point of confusion, they have a var named vehicle attached to the datatable. How is this being populated with the currently selected record upon mouseover? I initially thought a getter was being called to complete the population. It seems like this is not the case. Also, where can I see the ToolTipData bean. This might help as well. The only thing I see from the demo is the page.