function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Venki123Venki123 

Open vf page in pop-up lightening

Hi all, I am trying to open vf page in lightening pop up window. Can you please post a sample code how to do that. I tried with work space api it did not work.i also tried with quick action navigate URL but it opening on tab not pop window. Can you please help
Alain CabonAlain Cabon
Hi,

Modals:  https://www.lightningdesignsystem.com/components/modals/

By default the background of the popup is just a gray panel (the underlying page is hidden).
  • When the modal is open, everything behind it has HTML attribute aria-hidden="true", so assistive technology won't read out the underlying page. The best way to do this is to give the modal and the page separate wrapper elements and toggle aria-hidden="true"/aria-hidden="false" on the main page's wrapper depending on whether or not the modal is open.
https://salesforce.stackexchange.com/questions/107775/salesforce-lightning-design-system-modals

The visual effect is great but you will have some problems with this modal window (error message for instanc).
 
Venki123Venki123
Hi Alain cabin I am able to pop up model now thanks for the help.how to load URL within the model without button click. 
Alain CabonAlain Cabon
Hi,

For external URL (ie: google.com), that doesn't work anymore since 2015 into an iframe.

https://developer.salesforce.com/docs/atlas.en-us.pages.meta/pages/pages_compref_iframe.htm
Yogeshwar TailorYogeshwar Tailor
Hi Venki123,

please try the below code.
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" access="global">
    
    <div class="demo-only" style="height: 640px;">
        <section role="dialog" tabindex="-1" aria-labelledby="modal-heading-01" aria-modal="true" aria-describedby="modal-content-id-1" class="slds-modal slds-fade-in-open" >
            <div class="slds-modal__container">
                <header class="slds-modal__header">
                    <button class="slds-button slds-button_icon slds-modal__close slds-button_icon-inverse" title="Close">
                       
                        <span class="slds-assistive-text">Close</span>
                    </button>
                    <h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">Modal Header</h2>
                </header>
                <div class="slds-modal__content slds-p-around_medium" id="modal-content-id-1">
                	
                    <iframe src="{!'https://myedition-lightning-dev-ed--c.ap5.visual.force.com/apex/StationCheck'}" width="100%" height="500px;" frameBorder="0"/>
                </div>
              
            </div>
        </section>
        <div class="slds-backdrop slds-backdrop_open"></div>
    </div>
</aura:component>

Thanks,
Yogesh