function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
witoutme247witoutme247 

Actionsupport action not executing in the right order

I'm building a task detail page with hover links in the bottom (similar to related list hovers). The difference is these links will display information according to our custom logic.

In this demo, I have two outputtext in the bottom of the detail page, each with actionSupport tags associated with them. The problem is, when I hover over the first text, the action from the second actionsupport executes. Irrespective of the number of outputtext+actionsupport, the action executed is always the last actionsupport tag. I dont understand if I'm missing something. I always end up rerendering the last pageblock again and again.

Please help.

The VF Page

 

<apex:page standardController="Task" sidebar="True" Title="Task:" extensions="HyperTaskDetail" action="{!onload}">
<apex:detail subject="{!task.Id}"/>
<apex:param name="infoid" value="{!task.WhoId}"/>
<apex:form >
<apex:outputPanel >
<table width="950" border="0" cellspacing="0" cellpadding="0">
<tr align="center" valign="top" >
<td height="26" > <u><apex:outputText value="Call Completed - With Relevant Contact [{!ccRCsize}]"/></u>
<apex:actionSupport event="onmouseover" action="{!callRC}" rerender="panel"/>
</td>

<td height="26"> <u><apex:outputText value="Call Completed - Team Call [{!ccTCsize}]"/></u>
<apex:actionSupport event="onmouseover" action="{!callTC}" rerender="panel"/>
</td>

</tr>
</table>
</apex:outputPanel>
</apex:form>
<apex:outputPanel id="panel">
<apex:pageBlock id="block1">
1:{!render1},2:{!render2},3:{!render3},4:{!render4}
<apex:outputPanel id="info1">
<apex:pageBlockTable rendered="{!render1}" value="{!CallCRC}" var="c1"title="Call Completed - With Relevant Contact">
<apex:facet name="caption"><strong>Call Completed - With Relevant Contact</strong></apex:facet>
<apex:column > <apex:facet name="header"> Assigned </apex:facet>{!c1.Owner.Name}</apex:column>
<apex:column > <apex:facet name="header"> Subject </apex:facet>{!c1.Subject}</apex:column>
<apex:column > <apex:facet name="header"> Status </apex:facet>{!c1.Status}</apex:column>
<apex:column > <apex:facet name="header"> Comments </apex:facet> {!c1.Description} </apex:column>
</apex:pageBlockTable>
</apex:outputPanel>
<apex:outputPanel id="info2" >
<apex:pageBlockTable rendered="{!render2}" value="{!CallCTC}" var="c2"title="Call Completed - Team Call">
<apex:facet name="caption"><strong>Call Completed - Team Call</strong></apex:facet>
<apex:column > <apex:facet name="header"> Assigned </apex:facet>{!c2.Owner.Name}</apex:column>
<apex:column > <apex:facet name="header"> Subject </apex:facet>{!c2.Subject}</apex:column>
<apex:column > <apex:facet name="header"> Status </apex:facet>{!c2.Status}</apex:column>
<apex:column > <apex:facet name="header"> Comments </apex:facet> {!c2.Description} </apex:column>
</apex:pageBlockTable>
</apex:outputPanel>

</apex:pageBlock>
</apex:outputPanel>
</apex:page>

 

The extension:

 

public with sharing class HyperTaskDetail {
private final Task t;
public Boolean render1{get; set;}
public Boolean render2{get; set;}
public Boolean render3{get; set;}
public Boolean render4{get; set;}

public HyperTaskDetail(Apexpages.StandardController controller){
this.t = (Task)controller.getRecord();
}
public List<Task> tList = new List<Task>();
public List<Task> ccRC {get; set;}
public List<Task> ccTC {get; set;}
public List<Task> ccAM {get; set;}

public List<Task> ccO {get; set;}
public PageReference onload(){

render1=false;
render2=false;
render3=false;
render4=false;
if(t.WhoId!=null){
tList = new List<Task>();
for(Task tk :[select Id, Owner.Name, WhoId, Status, Subject, Description, Type from Task where WhoId = :t.WhoId]){
tList.add(tk);
}
System.debug('ALL TASK LIST---'+tList);
}
getCallCompletedRC();
getCallCompletedTC();
getCallCompletedAM();
getCallCompletedO();
return null;
}
public List<Task> getCallCompletedRC(){
ccRC = new List<Task>();
for(Task tk: tList){
if(tk.Type.contains('Call Completed - With Relevant Contact')){
ccRC.add(tk);
}
}
System.debug('ALL CC LIST--'+ccRC);
return ccRC;
}
public integer getCCRCsize(){
System.debug('CC SIZE'+ccRC.size());
return ccRC.size();
}
public List<Task> getCallCRC(){
return ccRC;
}

public List<Task> getCallCompletedTC(){
cctc = new List<Task>();
for(Task tk: tList){
if(tk.Type.contains('Call Completed - Team Call')){
cctc.add(tk);
}
}
return cctc;
}
public integer getCCTCsize(){
System.debug('CC SIZE'+cctc.size());
return cctc.size();
}
public List<Task> getCallCTC(){
return ccTC;
}
public List<Task> getCallCompletedAM(){
ccam = new List<Task>();
for(Task tk: tList){
if(tk.Type.contains('Call Completed - with AM')){
ccam.add(tk);
}
}
return ccam;
}
public integer getCCAMsize(){
System.debug('CC SIZE'+ccam.size());
return ccam.size();
}
public List<Task> getCallCAM(){
return ccAM;
}
public List<Task> getCallCompletedO(){
cco = new List<Task>();
for(Task tk: tList){
if(tk.Type.contains('Call Completed - Other')){
cco.add(tk);
}
}
return cco;
}
public integer getCCOsize(){
System.debug('CC SIZE'+cco.size());
return cco.size();
}
public List<Task> getCallCO(){
return ccO;
}
public PageReference callRC(){
System.debug('IN RC');
render1=true;
render2=false;
render3=false;
render4=false;
return null;
}
public PageReference callTC(){
System.debug('IN TC');
render1=false;
render2=true;
render3=false;
render4=false;
return null;
}
public PageReference callAM(){
render1=false;
render2=false;
render3=true;
render4=false;
return null;
}
public PageReference callO(){
render1=false;
render2=false;
render3=false;
render4=true;
return null;
}
}

 

 

 

 

 

Message Edited by witoutme247 on 11-13-2009 03:55 AM
WesNolte__cWesNolte__c

Hey

 

Try making the actionSupport a child of the component it supports e.g.

 

 

<u><apex:outputText value="Call Completed - Team Call [{!ccTCsize}]"><apex:actionSupport event="onmouseover" action="{!callTC}" rerender="panel"/>
</apex:outputText></u>


Let me know how that goes.

Wes
witoutme247witoutme247

I've tried that. The actionsupport doesnt execute at all in such a case.

 

table width="950" border="0" cellspacing="0" cellpadding="0"> <tr align="center" valign="top" > <td height="26" > <u><apex:outputText value="Call Completed - With Relevant Contact [{!ccRCsize}]"> <apex:actionSupport event="onmouseover" action="{!callRC}" rerender="panel"/></apex:outputText></u> </td> <td height="26"> <u><apex:outputText value="Call Completed - Team Call [{!ccTCsize}]"> <apex:actionSupport event="onmouseover" action="{!callTC}" rerender="panel"/></apex:outputText></u> </td> </tr> </table>

 

 

 

witoutme247witoutme247
I've fixed it by enclosing the outputtext and actionsupport in a outputpanel tag

<td height="26" ><apex:outPutpanel > <u><apex:outputText value="Call Completed - With Relevant Contact [{!ccRCsize}]"/></u> <apex:actionSupport event="onmouseover" action="{!callRC}" rerender="panel"/></apex:outPutpanel> </td>

 

This points to another question

1. How do I make the mouse show the hand on hover? Right now it just shows a vertical line

2. When I move the mouse away from the text, can I make the rerendered pageblocktable disappear?

WesNolte__cWesNolte__c

After some digging I realised that the JS isn't attaching to the outputText because SF doesn't render a HTML tag for outputTexts. If you replace it with outputLabel(or wrap it like you have) it'll work. Both of you other questions are answered by the code below:

 

 

<apex:page controller="ParamTestController">
<apex:form >
<apex:outputPanel >
<apex:outputLabel value="{!text}" style="cursor:pointer">
<apex:actionSupport event="onmouseover" action="{!changeParm}" rerender="theBlock" status="status"/>
<apex:actionSupport event="onmouseout" action="{!changeParmAgain}" rerender="theBlock" status="status"/>

</apex:outputLabel>

</apex:outputPanel>
</apex:form>

<apex:actionStatus id="status" startText="Working.." stopText=""/>

<apex:outputPanel layout="block" id="theBlock">
<apex:outputText value="{!parameter}" />
</apex:outputPanel>


</apex:page>

 

public with sharing class ParamTestController {
private String parameter;
public String text{get;set;}

public ParamTestController(){
parameter = 'Hello';
text = 'Dummy Text';
}

public void changeParm(){
parameter = 'Goodbye';
}

public void changeParmAgain(){
parameter = 'Love you long time.';
}

public String getParameter(){
System.debug('Getting parm: '+parameter);
return parameter;
}
}

 

 

 

 

 Wes

 

Message Edited by weznolte on 11-16-2009 12:07 PM
witoutme247witoutme247

That worked. THank yu Wes.

But I'm concerned with the response times. THe mouseover and mouse take a a sec or two (especially in the beginning). ANd I'm 1. Rerendering only 5 records (during test) and 2. I'm getting all my records on page load.

How do I speed this up? How do I make it as responsive as the standard SF relatedList hovers?

WesNolte__cWesNolte__c

Ah, that's a question I used to ask too, but the answer isn't such a nice one. You have to build your own Javascript(or use jQuery for a quick fix). I would suggest trying this out, even though there's a bit of a learning curve, the knowledge is invaluable.

 

Good luck,

Wes