4

Here is the requirement:

I have added a custom button on a standard Salesforce page. I want to pass a field value from this standard salesforce page to the button (or the pop up that opens up when the button is clicked). The scenario is similar to something like this: Say, I add a custom button to the Account and call it 'Add Property'. This 'Add property' button when clicked opens a popup containing a field called 'Account Number' which needs to be pre-populated with the Acc Number from the standard page.

Please let me know of any possible ways to do this.

Here is the Javascript that opens the popup:

{!REQUIRESCRIPT('/soap/ajax/26.0/connection.js')} 
{!REQUIRESCRIPT('/js/functions.js')} 
{!REQUIRESCRIPT('/resource/jQueryForPopup/jQuery/jquery-1.8.2.min.js')} 
{!REQUIRESCRIPT('/resource/jQueryForPopup/jQuery/ui/jquery-ui-1.9.1.custom.min.js')} 
{!REQUIRESCRIPT('/resource/jQueryForPopup/jQuery/postmessage/jquery.ba-postmessage.js')} 
{!REQUIRESCRIPT('/resource/jQueryForPopup/jQuery/bbq/jquery.ba-bbq.min.js')} 
requireCssFile('/resource/jQueryForPopup/jQuery/ui/css/ui-lightness/jquery-ui-1.9.1.custom.min.css'); 


function requireCssFile(filename) 
{ 
var fileref = document.createElement('link'); 
fileref.setAttribute('rel', 'stylesheet'); 
fileref.setAttribute('type', 'text/css'); 
fileref.setAttribute('href', filename); 
document.getElementsByTagName('head')[0].appendChild(fileref); 
} 


var j$ = jQuery.noConflict(); 
var iframe_url = '{!URLFOR("/apex/Add_address")}'; 

var j$modalDialog = j$('<div id="opppopup"></div>') 
.html('<iframe id="iframeContentId" src="' + iframe_url + '" frameborder="0" height="100%" width="100%" marginheight="0" marginwidth="0" scrolling="no" />') 
.dialog({ 
autoOpen: false, 
title: 'Add Details', 
resizable: true, 
width: 800, 
height: 540, 
autoResize: true, 
modal: true, 
draggable: true 
}); 

j$modalDialog.dialog('open');
3

You can pull fields from the record that the custom button is rendered on using merge syntax.

Here's an example from one of my dev orgs:

enter image description here

In this case the button sits on a BGPM__Project__c view page, opens a Visualforce URL and passes the id of the current project as a parameter using the merge field BGPM__Project__c.Id.

You can read more on this at:

http://help.salesforce.com/apex/HTViewHelpDoc?id=links_merge_fields.htm&language=en_US

| improve this answer | |
  • hey bob! The content source for my button is a JAVASCRIPT that is used to open the popup. So, having the content source as URL is not possible (i guess..) I have added the Javascript that is executed on the button click. – juhi Jul 18 '14 at 10:04
  • You can use merge fields on JavaScript buttons too - just remember to put it in quotes, as otherwise the browser will try to interpret them as JavaScript. – Bob Buzzard Jul 18 '14 at 10:16
  • Is it possible to use merge fields even if i have not used a standard controller? the javascript that is used to show the popup further calls my VF page which has a custom controller defined in it. – juhi Jul 18 '14 at 10:53
  • The merge fields are unrelated to the controller - they are simply values that will be replaced in the JavaScript. If you pass them in as a parameter on the URL to your popup, your controller will have to extract and handle them as it needs to. If you are looking for an example of pulling parameters off the URL, here's one: bobbuzzard.blogspot.co.uk/2011/06/… – Bob Buzzard Jul 18 '14 at 11:02
-1

Step 1 - Login to your Salesforce.com develer account Step 2 - Click "Setup" in the upper right corner Step 3 - Under the App Setup section (left menu), expand Develop Step 4 - Click on Apex Classes Step 5 - Click the "New" button to create a new Apex Class Step 6 - Add the following source and click the "Save" button. (we'll walk through what this does in a moment). Download full tstpopup Class source

public class tstpopup {     

    public boolean displayPopup {get; set;}     

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

  }

Step 7 - Click on Pages (below Apex Classes on the left menu) Step 8 - Create a new Visualforce page by clicking the "New" button Step 9 - For the purpose of this tutorial I used "tstpopup" for my Label & Name Step 10 - Enter the Visualforce Markup code below and click "Save" (we'll walk through what it all means in a moment). Download full tstpopup Visualforce Markup source

<apex:page controller="tstpopup">
    <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>

Step 11 - Now, to view the finished page, you'll need to go up to the browser address bar and navigate to the apex directory in your Salesforce.com account and type in the page name. For me, that is the following:

https://na3.salesforce.com/apex/tstpopup

you will get popup u can easily use it and continue ur programming further

| improve this answer | |
  • thanks..but i don't require the code for opening a popup...What I want is to pre-populate a field in the popup with a field present in the standard salesforce page – juhi Jul 18 '14 at 9:58
  • 1
    You should have just linked to the original blog post rather than pasting it all in here again : salesforcegeneral.com/salesforce-modal-dialog-box – Bob Buzzard Jul 18 '14 at 10:15

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.