7

I'm trying to create a pageblocktable that uses lookuphoverdetails to display the mini page details for Accounts on a custom object.

The problem that I'm experiencing is that the pageblocktable is contained inside a scrollable outputpanel.

When the user scrolls down the table the hover shows up towards the bottom of the page where the row would have existed if it wasn't inside the scrollable outputpanel.

Has anyone exeperienced this issue? It looks like the VF Page creates hidden entries for the lookup hovers that are down the bottom of the page.

Here is the sections of the page that has the problem:

<style type="text/css">
    .tableContainer
    {
        height:200px; 
        width: 100%;
        //overflow: auto;
        overflow: scroll;
        -webkit-overflow-scrolling: touch;
    }   
</style>  

...

<apex:outputpanel styleClass="tableContainer" layout="block">
  <apex:pageblockTable value="{!lstOrderList}" var="o" styleclass="floatingHeaderTable"  id="OResTbl">
    <apex:column id="colCheck" >
      <apex:inputCheckbox value="{!o.isSelected}" id="checkedone" disabled="{!o.isSelected}"/>
      <apex:actionSupport event="onclick" action="{!DisplayOrderItems}" rerender="SearchCriteria,OResTbl,OIRes" onsubmit="LockScreen('Updating Results...');" oncomplete="UnlockLockScreen();" 
        rendered="{!o.isSelected == false}" >

        <apex:param name="selId" value="{!o.Order.Id}" />
      </apex:actionSupport>
    </apex:column>

    <!-- Order Field Set -->
    <apex:repeat var="f" value="{!$ObjectType.Order_Credit__c.FieldSets.OrderSearch}">
      <apex:column id="colField">

        <apex:facet name="header" >
          <apex:commandlink action="{!Search}"  value="{!f.label}" rerender="SearchCriteria,pageResult" onclick="LockScreen('Searching...');" oncomplete="UnlockLockScreen();" >
            <apex:image url="{!URLFOR($Resource.VFIcons,'col-move-bottom.gif')}" rendered="{!UPPER(sortExpression)==UPPER(f.fieldpath) && sortDirection= 'ASC'}"/>
            <apex:image url="{!URLFOR($Resource.VFIcons,'col-move-top.gif')}" rendered="{!UPPER(sortExpression)==UPPER(f.fieldpath) && sortDirection = 'DESC'}"/>
            <apex:param value="{!f}" name="column" assignTo="{!sortExpression}" ></apex:param>
          </apex:commandlink>

        </apex:facet>

        <apex:outputPanel rendered="{!f.fieldPath=='Name'}" >   
          <a href="/{!o.Order.Id}" id="{!o.Order.Id}" target="_blank" onblur="LookupHoverDetail.getHover('{!o.Order.Id}').hide();" 
                                       onfocus="LookupHoverDetail.getHover('{!o.Order.Id}', '/{!o.Order.Id}/m?retURL=%2F{!o.Order.Id}&isAjaxRequest=1').show();" 
                                       onmouseout="LookupHoverDetail.getHover('{!o.Order.Id}').hide();" 
                                       onmouseover="LookupHoverDetail.getHover('{!o.Order.Id}', '/{!o.Order.Id}/m?retURL=%2F{!o.Order.Id}&isAjaxRequest=1').show();">
                                       {!o.Order.Name}
          </a> 
        </apex:outputPanel>

...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.