Adding page items before the HTML form in Oracle APEX

Can’t display page item because the HTML form was not yet opened.

You’re most likely to get this haunted error message when you are playing around with the page template in Oracle Application Express (APEX). This message seems straigtforward and solution is frankly not that difficult, but let’s dive in any way and understand what it means.

Most page items are represented by the input elements (INPUT, SELECT, TEXTAREA, LABEL, etc..). Commonly, input elements contains data that can be sent to a server for further processing. To enable this process, input elements must be embedded within the HTML form element. When these elements do not appear within a form, it will not know where to send the data unless it responds to certain intrinsic events, like defined in JavaScript.

<form name="input" action="/do/login" method="post">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>

APEX uses #FORM_OPEN# and #FORM_CLOSE# substitution strings to enable the HTML form element. Unfortunately it only allows page items to be added after #FORM_OPEN# is applied, hence the error message. Remarkably, it does allow page items to be added after #FORM_CLOSE# form is closed. But what is interesting is why do they allow buttons to be added before #FORM_OPEN#?.

Understanding that page items will only work after #FORM_OPEN#, everybody will agree that we need to move the page item to a position after #FORM_OPEN# is called.

But what if I want to add a page item before #FORM_OPEN#?

Just sit down and let me tell you how! You can either choose for easy solution (a) comment the pound substitution string in the page template

<!-- #FORM_OPEN# -->

(b) create Application Process, Page Process or (c) Region plugin that utilize undocumented global variable.

wwv_flow.g_form_painted := true;
Beware: this undocumented global variable can be modified in the future releases! and using input elements outside the form element will not be submitted with your request.

Application Process or Page Process

Application Processes can be used to perform actions required for every page, whereas page process will only work for the requested page.

By utilizing undocumented global variable, the page receives the capability to allow page items to be rendered during page processing before #FORM_OPEN# substitution string. It basically does nothing special apart from telling apex that the form element has started.

Just add the undocumented global variable to your application or page process source and set the Process Point to On Load: Before Header.

Application Process

Region plugin

Simply insert the following code to your plugin region’s render function source:

function render (
    p_region              in apex_plugin.t_region,
    p_plugin              in apex_plugin.t_plugin,
    p_is_printer_friendly in boolean )
return apex_plugin.t_region_render_result is
begin
    wwv_flow.g_form_painted := true;
    return null;
end render;

It is mandatory that the page items are set to be displayed below the main region content to ensure that the render function above is executed first before the items are drawn. Set Item Display Position value to Below Content in Region Definition section just as shown in the snapshot below.
Region Definition
You are thus able to add page items to the region, which will be displayed on your page. Voila, no more nightmares.

You can download the application proces or region plugin from GitHub and import this in your apex application. Just to make your life easier!

Happy coding!

References
  • Docs.oracle.com, (2014). Understanding Application Processes. [online] Available at: http://docs.oracle.com/cd/E23903_01/doc/doc.41/e21674/bldr_app_proc.htm [Accessed 18 Oct. 2014].