function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
lindulindu 

How come my popup doesn't disappear?

Hi!

I am trying to put members in groups by using a popup with a pageblocktable inside with inputcheckboxes. So far, so good. But after I've chosen and processed the chosen groups, I want the popup to disappear. I thought it would be enough by setting isLookupfld to false and then rerender the popup (reRender="popup" in commandbutton). But it doesn't work. What is wrong in my code?

 

<apex:page standardcontroller="xx" extensions="ChooseNumberController,PopupController">
    <apex:form >
        
        <apex:pageBlock >

            
            <apex:pageBlockSection >
            <apex:pageBlockTable value="{!joinName}" var="j" width="100" columns="4">
                <apex:column value="{!j.jnd.usr.name}" headerValue="Name" />
                <apex:column headerValue="Popup">
                  <apex:commandLink rendered="{!lookupvisible}" value="..." id="lookupButton" action="{!setlookupmethod}" styleclass="btn" style="color:black;text-decoration:none;">
                 </apex:commandLink>
                </apex:column>
            </apex:pageBlockTable><br/>
         </apex:pageBlockSection>
         
         <apex:pageblockSection showheader="false">
             <apex:outputPanel id="popup" rendered="{!isLookupfld}" styleClass="customPopup" layout="block" >
                 <apex:pageBlockTable value="{!joinedWrp}" var="j">
                    <apex:column ><apex:inputCheckbox value="{!j.selected}" id="checkedone" >
                    </apex:inputCheckbox></apex:column>
                    <apex:column value="{!j.g.name}"/>
                 </apex:pageBlockTable>
                 <apex:commandButton value="Add Groups" action="{!processChosenGroups}" reRender="popup"/>
             </apex:outputPanel>
         </apex:pageblockSection>
        
         </apex:pageBlock> 
    </apex:form>
    
    <style type="text/css">
     .customPopup{
         background-color: white;
         border-color: grey;
         border-style: solid;
         border-width: 2px;
         left: 50%;
         padding:10px;
         position: absolute;
         z-index: 9999;
         width: 400px;
         margin-left: 160px;
         top:100px;
     }
    </style>

</apex:page>

    public Pagereference processChosenGroups() {
        
        List<Group__c> chosenGroups = new List<Group__c>();
        for(jnwrapper j : joinedlist){
            if(j.selected == true){
                chosenGroups.add(j.g);
            }
        }
        isLookupfld = false;
        return null;
    }  

 

Best regards!

soofsoof

You need to reRender a container that contains <apex:outputPanel id="popup" />.  Try something like below:

 <apex:pageblockSection id="popupSection" showheader="false">
     <apex:outputPanel id="popup" rendered="{!isLookupfld}" styleClass="customPopup" layout="block" >
         <apex:pageBlockTable value="{!joinedWrp}" var="j">
            <apex:column ><apex:inputCheckbox value="{!j.selected}" id="checkedone" >
            </apex:inputCheckbox></apex:column>
            <apex:column value="{!j.g.name}"/>
         </apex:pageBlockTable>
         <apex:commandButton value="Add Groups" action="{!processChosenGroups}" reRender="popupSection"/>
     </apex:outputPanel>
 </apex:pageblockSection>

 

Hope this helps.

 

Thanks.
lindulindu

Hi again!

 Thankyou for your reply, but the same thing still happens: the checkboxes in the popup gets unchecked, but it doesn't disappear. If i change the "return null" in the method do this:

 

        Pagereference curpage = Apexpages.CurrentPage();
        curPage.setredirect(true);
        return curPage;

 

..the popup disappears, but then the whole page refreshes, which I do not want. Do you have some other idea?

 

Best regards

E
Richie DRichie D

Hi,

 

You need to do something in the client via Javascript to do this. So for example setting the display property of the outputPanel to none would hide the panel; just flip it to 'block' when you want it to show. You can do this with style classes if you wish.

 

Code might look something like:-

<apex:pageblockSection showheader="false">
             <apex:outputPanel id="popup" rendered="{!isLookupfld}" styleClass="customPopup" layout="block" >
                 <apex:pageBlockTable value="{!joinedWrp}" var="j">
                    <apex:column ><apex:inputCheckbox value="{!j.selected}" id="checkedone" >
                    </apex:inputCheckbox></apex:column>
                    <apex:column value="{!j.g.name}"/>
                 </apex:pageBlockTable>
                 <apex:commandButton value="Add Groups" action="{!processChosenGroups}" onclick="hideSection('{!$Component.popup}');" reRender="popup"/>
             </apex:outputPanel>
         </apex:pageblockSection>
        
         </apex:pageBlock> 
    </apex:form>
    
    <style type="text/css">
     .customPopup{
         background-color: white;
         border-color: grey;
         border-style: solid;
         border-width: 2px;
         left: 50%;
         padding:10px;
         position: absolute;
         z-index: 9999;
         width: 400px;
         margin-left: 160px;
         top:100px;
     }
    </style>

<script>
 function hideSection(sectionId){
  document.getElementById(sectionId).style.display = 'none';
}
</script>

 This is only pseudo code so may need tweeking but the idea is correct. You might want to have a showSection method that can be called to show the div after the hideSection has made it invisible. 

 

Good luck

Rich.
lindulindu
Hi! I don't have much knowledge of JavaScript. But what happens now is that the popup disappear for lets say half a second and then reappears again. How is this possible? Best regards, E
Richie DRichie D

Your rerender is probably firing to reload the panel thereby resetting the visibility. 

R.
lindulindu
Hi, it was all in my controller, sorry! :)