Saturday, January 31, 2015

Oracle Application Express EA3 is now available

APEX EA3 is here

Just read this one on Twitter:
So head over to apexea.oracle.com, request your workspace and start testing all the new features.

I received my access within minutes, so be prepared to immediately have a reason for spending time on your computer. ;-)
First thing I did was checking out the "Universal Theme Sample Application".
Shakeeb did a very good job of explaining the Universal Theme Components.

Interestingly the beta documentation for APEX 5.0 was already made available.
A very nice move in my opinion. Click on the link above or use http://docs.oracle.com/cd/E59726_01/index.htm.

So long for now folks and enjoy your first weekend with APEX 5.0 EA3. ;-)

Friday, January 30, 2015

APEX jQuery Modal Dialog Oddities

Lately I have been working on creating a new version of my demo application for the APEX IR XLSX Downloader.
The package provides a set of configuration parameters which I thought would be nice to present to the user instead of being solely defined by the developer.
During that I encountered some oddities when using a jQuery Modal Dialog to render a region as a modal dialog.

Note: I'll show you the steps to reproduce and fix in a newly created application. But you can also just create a new page in an existing application.

Steps to reproduce and fix:
  1. Navigate to the page where you want to put the modal region containing form elements.
  2. Create a new region accepting all defaults
  3. Create a button in that region and set Action to "Defined by Dynamic Action"
  4. Create a new region accepting defaults except for "Display Attributes"
    Select "jQuery Modal Region Template" as "Region Template"
  5. Create at least one item which should save session state on the modal region.
    I used a text item and made it submit on enter for this example.
  6. Create the dynamic action reacting to button click.



  7. Run a simple test
    1. Run the page
    2. Click open Dialog button
    3. Enter something in the text field and hit enter.
    4. Now verify session state
    5. So we submitted the page with a new value in the item, but it doesn't look like it was pushed into session state.
  8. Finding the reason for session state not being updated.
    1. Analyze DOM before dialog open.
    2. Analyze DOM after dialog open.
  9. This tells us that the region gets moved outside of the <form> container, making the item invisible to APEX.
    Therefore no update in session state.
  10. Steps to fix DOM
    1. Create Dynamic Action which fires "Before Page Submit"
    2. Set action to "Execute Javascript Code":
      apex.jQuery( this.affectedElements ).dialog( "destroy" ).appendTo( 'form#wwvFlowForm' );
      
    3. Set "Affected Elements" identical to previous Dynamic Action.
  11. Test again with same steps as noted in 7.
    This should now work.


  12. Enjoy nicely working modal dialogs.