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
Siva SakthiSiva Sakthi 

Have to open a Popup window by clicking the Command button

Hi,
I have created a Component and a Page.Below is my Component Code

<apex:component controller="contentController">
<script src="/soap/ajax/15.0/connection.js" type="text/javascript"></script>
<script src="/soap/ajax/15.0/apex.js" type="text/javascript"></script>
<Script type="text/javascript">

function WindowNew()
{
  Window.open('https://dataloader.io/');
}
</Script>
<apex:form >
<apex:commandbutton onclick="Window.open('https://dataloader.io/')" value=" Upload "/>
<apex:commandbutton onclick="Window.open();" value="Upload "/>
</apex:form>
</apex:component>

Below is my Page Code

<apex:page controller="contentController">
<script src="/soap/ajax/15.0/connection.js" type="text/javascript"></script>
<script src="/soap/ajax/15.0/apex.js" type="text/javascript"></script>
<c:BulkUpload />
</apex:page>

While clicking the Button,the window is not opening as a popup.Can anyone help me to solve this issue.

Thanks
Maheshwar
 
Shaijan ThomasShaijan Thomas
<apex:page controller="tstpopup" sidebar="true">
    <apex:form >
        <apex:commandButton value="Show Pop up" action="{!showPopup}" rerender="tstpopup"/>
        <apex:pageBlock >
            This is just filler text from the Salesforce General. 
        </apex:pageBlock>
<apex:outputPanel id="tstpopup">
        <apex:outputPanel styleClass="popupBackground" layout="block" rendered="{!displayPopUp}"/>
            <apex:outputPanel styleClass="custPopup" layout="block" rendered="{!displayPopUp}">
                This is where I would put whatever information I needed to show to my end user.<br/><br/><br/>
                <apex:commandButton value="Hide Pop up" action="{!closePopup}" rerender="tstpopup"/>
            </apex:outputPanel>
        </apex:outputPanel>
 
    </apex:form>
 
    <style type="text/css">
        .custPopup{
            background-color: white;
            border-width: 2px;
            border-style: solid;
            z-index: 9999;
            left: 50%;
            padding:10px;
            position: absolute;
            /* These are the 3 css properties you will need to change so the popup 
            displays in the center of the screen. First set the width. Then set 
            margin-left to negative half of what the width is. You can add 
            the height property for a fixed size pop up if you want.*/
            width: 500px;
            margin-left: -250px;
            top:100px;
        }
        .popupBackground{
            background-color:black;
            opacity: 0.20;
            filter: alpha(opacity = 20);
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            z-index: 9998;
        }

    </style>
</apex:page>
//////////////////////////////////////////////
public class tstpopup {     

    public boolean displayPopup {get; set;}     
    
    public void closePopup() {        
        displayPopup = false;    
    }     
    public void showPopup() {        
        displayPopup = true;    
    }
    
  }

This may help you
Thanks
Shaijan Thomas
SF AdminSF Admin
Hi,

You need to add return infront of confirm.So when u click on ok it returns true and call action method otherwise do nothing.
<apex:commandbutton onclick="return  Window.open('https://dataloader.io/')" value=" Upload "/>
Shaijan ThomasShaijan Thomas
what kind of popup you need, is it vf or java script popup?
shaijan
Siva SakthiSiva Sakthi
I need java script popup.
Shaijan ThomasShaijan Thomas
function PopulateCCeMail(ccEmail)
    {
        //alert(ccEmail);
        window.parent.opener.CCeMailPopulate('{!CallBackId}',ccEmail);
    }
/// above code in your popup

function CCeMailPopulate(CallBackId,ccEmail)
        {
             var eMVal = document.getElementById(CallBackId).value;
             if (eMVal != null && eMVal != '') 
                 document.getElementById(CallBackId).value = eMVal +';'+ccEmail;  
             else     
                 document.getElementById(CallBackId).value = ccEmail;
        }
// this is in your parent
Siva SakthiSiva Sakthi
I am using the component in VF page. I tried to use the below code in component also but its not working.

Note: I will add the same java script funtion in many pages. so,  i want to avoid copy & past same code in many page. thats why i have created the component for the same function to use many pages. Please guide me to add and call the same java script function and CSS files in component .

<apex:commandbutton onclick="return  Window.open('https://dataloader.io/')" value=" Upload "/>

Thanks
Maheshwar