For PopUp using Lightning Web Component, check https://www.infallibletechie.com/2020/03/popup-using-lightning-web-component-lwc.html. Following example is for Salesforce classic only.
1. Add the below .zip file in Static Resources.
Click this link to download the file jQueryForPopup.

2. Create a Custom button with On Click Java script functionality.

Java script code for button:
{!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/Sample")}';
var child_domain = iframe_url.substring(0, iframe_url.indexOf('/', 9));
var parent_domain = window.location.protocol + '//' + window.location.host;
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: 'Sample Popup',
resizable: true,
width: 800,
height: 540,
autoResize: true,
modal: true,
draggable: true
});
j$modalDialog.dialog('open');
3. Add the Custom button created to the page layout and check the popup.

There was an Error…..A problem with the OnClick JavaScript for this button or link was encountered:
jQuery is not defined
Check whether in your static resources you have added the jQuery zip file mentioned in the 1st step.
Cheers!
i added the static resources jQuery zip file….but in which place i just use this static resource i mean jQuery zip file…..and i have one doude regarding content type…..here i have static resource jQuery Content type is "application/octet-stream" and u have diffrent content type….so that's problem or diffrent one……
ok please follow the above same willdo like that i am getting
One of the best resources for salesforce I came across.. Thanks very much for this.. Cheers!!!
In addition i was showing this on service console on contact detail page with the id of the record being passed.
Find the same below. Might help someone someday.
if (sforce.console.isInConsole())
var iframe_url = '{!URLFOR("/apex/AuthenticateCustomer")}'+'isdtp=vw&id='+'{!Contact.Id}';
else{
var iframe_url = '{!URLFOR("/apex/AuthenticateCustomer")}'+'?id='+'{!Contact.Id}';
}
Thank You!
Cheers…
Hi Magulan, thanks for the sample code!
Was wondering if it would be possible to implement a 'Cancel' button on the iframe VF page (next to the "Validate" button, for example) that uses the same functionality as the "X" close button? I can't get it quite right, either it's closing the entire page (including the parent page that originally called the popup) or it's closing just the iframe.
Thanks again
Similarly, how would you have the "Validate" button close the pop-up and direct to a new page?
Hi any solution to this yet?
This site explains what you're after
http://www.valnavjo.com/blog/modal-dialog-on-a-standard-salesforce-page/
Is there a way to add Cancel button inside the iframe of this popup??
I am stuck on this actually
Hi any solution to this yet?
this site explains what you're after
http://www.valnavjo.com/blog/modal-dialog-on-a-standard-salesforce-page/
HI,
How to call the apex method when we click the validate button.
Write a apex class, incorporate with the VF page and then using action attribute, you can call the apex method.
Cheers!!!
Question 1: I have Put the button in the vf page and load into the pop(Ifram). when click that buttonfrom that VF page, the current popup should close How to do this?
Question 2: I have implemented the following code in to the .html.
.html('')
Kindly guide me how to call the apex method in that button.
Note: Am new so please provide the code snippet.
Code is not visible here so i have posted in following stackoverflow
http://salesforce.stackexchange.com/questions/44474/how-to-call-the-apex-form-the-javascript-popup#44474
In apexpage, use controller="TestMethod".
Cheers!!!
good example but i want to know how to create createElement(apex:inputText) in javascript function
Hi,
Well explained to open a popup, But now neither its getting close & nor refreshing the parent window after click save button. Could you please explain which code will go into the VF page. to achieve this.
i have already gone through below site but it does`t help
http://www.valnavjo.com/blog/modal-dialog-on-a-standard-salesforce-page/
Thanks,
hi, if u not used the Jquery or java script. are we write v.f page? its possible or not.
hi, if u not used the Jquery or java script. are we write v.f page? its possible or not.
Awesome, this is really helpful! Thank you