user1054310
user1054310

Reputation: 171

Display the content of an html page (URL) in a jQuery modal window?

I have an Oracle APEX classic report and I would like to display an Oracle APEX page in a popup modal window ( detail information of the given record).

I would like to avoid plugins at all costs. Is this possible? I am using APEX 4.1.

Tamas

Upvotes: 0

Views: 8473

Answers (1)

hmarques
hmarques

Reputation: 406

Create a column with link on your report:

  • Link Text: Whatever you want
  • Target: URL
  • URL: javascript:openModal(#YOUR_ID#)

Add the following javascript code to your apex page (Function and Global Variable Declaration) changing the URL for the right APP_ID, PAGE_ID and ITEM_NAME of the popup page you want to open:

function openModal(vId){
    var url = 'f?p=<APP_ID>:<APP_PAGE>:&SESSION.::NO:RP,62:P<APP_PAGE>_ID:'+vID;
    var $dialog = $('<div id="ModalFacPenDiv" style="overflow:auto;overflow-y: hidden;"> <iframe id="modalID" src="'+url+'" width="900px" height="260px" frameborder="no" style="overflow:auto;"></iframe></div>');
    $($dialog).dialog({ 
        open: function(event, ui){
            $(".ui-dialog-titlebar-close").hide(); },
        modal: true , 
        dialogClass: 'noTitle', 
        title: 'YOUR TITLE' , 
        width : 920 , 
        height: 380, 
        buttons: { 
            "Close": function(){ 
                window.parent.doSubmit('REFRESH');
                $(this).dialog("close");} },
        closeOnEscape: false });
}

You'll need to set Embed in Frames to allow or Allow from same origin (this one is better/more secure) on Security Attributes > Browser Security.

I'm assuming that in the popup page you have the necessary processes to show the info based on some ID.

Hope it helps.

Upvotes: 2

Related Questions