This discussion is archived
4 Replies Latest reply: Sep 5, 2013 3:18 AM by af6c9743-b9f0-450c-b4ba-f5c9a81d6f5d RSS

Oracle Apex Modal Page

Tushar Lapani Newbie
Currently Being Moderated
Hi everone,
I have problem in modal page. I am using 4.2.0 apex version on the apex.oracle.com workspace. I want to create modal page for the form. I have done following changes on the report page though it is not working. When I click on the create button it displays only dialog box (like a popup as in actual output) without including form in it. It means only empty dialog box is displayed with scroller as output.

1) Under Action when button clicked
Action ----> Redirect to URL
URL Target -----> javascript:return false;
Button Attributes -----> id="modal"
Button Template -----> Button

2) In Button template, I have also copied the #button_substitution# string in the html code of the button. I also tried without copy and paste #button_substitution# string in the HTML code.

3) Then I have created dynamic action for the click event of the create button on the report page as follow

Event ----> Click
Selection Type ----> Jquery Selector
Jquery Selector ----> #modal
Action ---> Skill Builders Modal page 2.0.0
URL Location : Statically defined
Static URL ----> f?p=&APP_ID.:29:&APP_SESSION.:::29:::

So I want to know what is problem? I am looking for your quick reply.

Thanks in Advance
Tushar
  • 1. Re: Oracle Apex Modal Page
    Osama_Mustafa Oracle ACE
    Currently Being Moderated
    Mark it as answered here , and open it in


    Oracle Discussion Forums » Oracle Database » Application Express
  • 2. Re: Oracle Apex Modal Page
    986580 Newbie
    Currently Being Moderated
    Hi everone,
    I have problem in modal page. I am using 4.1 apex version on the apex.oracle.com workspace. I want to create modal page for the form. I have done following changes on the report page though it is not working. When I click on the create button it displays only dialog box (like a popup as in actual output) without including form in it. It means only empty dialog box is displayed with scroller as output.

    1) Under Action when button clicked
    Action ----> Redirect to URL
    URL Target -----> javascript:return false;
    Button Attributes -----> id="modal"
    Button Template -----> Button

    2) In Button template, I have also copied the #button_substitution# string in the html code of the button. I also tried without copy and paste #button_substitution# string in the HTML code.

    3) Then I have created dynamic action for the click event of the create button on the report page as follow

    Event ----> Click
    Selection Type ----> Jquery Selector
    Jquery Selector ----> #modal
    Action ---> Skill Builders Modal page 2.0.0
    URL Location : Statically defined
    Static URL ----> f?p=&APP_ID.:29:&APP_SESSION.:::29:::

    So I want to know what is problem? I am looking for your quick reply.

    Regards,
    Sangamesh
  • 3. Re: Oracle Apex Modal Page
    BillyVerreynne Oracle ACE
    Currently Being Moderated
    Wrong forum. This is a database forum. There is a dedicated Apex forum - PLEASE USE THE APEX FORUM.

    As for your issue. There is no such concept as a modal page in web architecture. There are modal regions (typically div's containing tables or forms).

    To make a modal region needs you to define a new region for the Apex theme used. The template of this region will look something as follow for a Jquery modal region:
    <script>
        $(function() {
            $( "<div-id-goes-here>" ).dialog({
                title: "<title goes here>",
                autoOpen: open,
                modal: true
            }).parent().appendTo("form");;
    
        });
    </script>
    
    <div id="<div-id-goes-here>" ...  >
      <...rest of region definition..>
    </div>
  • 4. Re: Oracle Apex Modal Page
    af6c9743-b9f0-450c-b4ba-f5c9a81d6f5d Newbie
    Currently Being Moderated

    Go to Share components > Security Attributes

    In "Browser Security" change "Embed in Frames" to "Allow"

     

    It will work

Legend

  • Correct Answers - 10 points
  • Helpful Answers - 5 points