Skip to Main Content

APEX

Announcement

For appeals, questions and feedback about Oracle Forums, please email oracle-forums-moderators_us@oracle.com. Technical questions should be asked in the appropriate category. Thank you!

iFrame in jQuery Dialog - submit iFrame using dialog button

610880Apr 7 2011 — edited Apr 15 2011
Hi Everyone,
I know a lot of us are using JQuery modal dialog feature and some of us using iframe strategy to display form or page inside of modal dialog popup. Personally, I am using these features a lot in my app but there is a step where I am a bit stuck.
Here is my situation ( I am sure most of us will be interested in this to be resolved if not yet):
I have a regular page (will call it parent page), on this page I have a button and by clicking on this button I am getting a jquery modal window popup. The button itself is pointed to url: javascript:LinkAssets(); and the script to call modal popup with iFrame in HTML Header of parent page is:
 
<script type="text/javascript"> 
// Link Assets - Modal PopUp 
    function LinkAssets(){ 
var apexSession = $v('pInstance'); 
var apexAppId = $v('pFlowId'); 
var assetNumber = $v('P17_ORDER_ID'); 
$(function(){vRuleBox = '<div id="LinkAssetsBox" title="Link Assets to the Order">
   <iframe src="f?p='+apexAppId+':55:'+apexSession+'::NO:55:P55_ORDER_NUMBER:'+assetNumber+'"
     width="680" height="320" title="Link Assets to the Order" frameborder="no">
   </iframe>
   </div>' 
$(document.body).append(vRuleBox); 
$("#LinkAssetsBox").dialog({buttons:{"Close":function(){$(this).dialog("close");}}, 
                                                               stack:true, 
                                                               modal:true, 
                                                               width:700, 
                                                               height:340, 
                                                               resizable:true, 
                                                               autoResize:true, 
                                                               draggable:true, 
                    close: function(){$("#LinkAssetsBox").remove(); 
                                                         location.reload(true);} 
});});} 
</script> 
As you see I am calling page 55 from jquery script into iFarme which will be displayed in modal dialog. All described above is working fine, no problems and most of us use it.
My problem is here: my JQuery modal dialog has a "CLOSE" button which allows me to close a modal dialog without any changes and go back to my parent page - which is normal behavior. In my iFarme page (page 55) i have an "apply changes" button, and this button calls a process on page 55 by submitting a value and than it closes the modal dialog. "APPLY Changes" button has pointed to the url: javascript:UpdateRecord(); and page 55 has a script in HTML Header to submit value and close modal dialog:
 
<script type="text/javascript"> 
// -- Function to apply changes and close Modal Dialog-- 
function closePopup(){      
   $(function(){parent.$('*').dialog('close');});} 
function UpdateRecord(){doSubmit('APPLY_CHANGES');closePopup();} 
</script> 
So, what I want is not to have this "Apply Changes" button in my page 55 which is iFrame page, I want this button to be next to my jQuery modal dialog "CLOSE" button which means I have to change my modal dialog popup script to include "APPLY CHANGES" button where this button will submit value to iFrame page and close my dialog.

I hope whatever is above is readable and understandable.
Thanks
Comments
Locked Post
New comments cannot be posted to this locked post.
Post Details
Locked on May 13 2011
Added on Apr 7 2011
8 comments
2,694 views