Pretius APEX Client Side Validation

Oracle APEX dynamic action plugin v1.1

The plugin is dynamic action plugin to validate APEX items according to defined APEX item validations on browser side - without submitting the form.

The plugin is no longer being maintained.

License

This plugin is currently available for use in all commercial and noncommercial projects under MIT license. License has been included with this software.

Legal Disclaimer

The program(s) and/or file(s) are supplied as is. The author disclaims all warranties, expressed or implied, including, without limitation, the warranties of merchantability and of fitness for any purpose. The author takes no responsibility, assumes no liability for damages, direct or consequential, which may result from the use of these program(s) and/or file(s).

Documentation

Detailed documentation, usage guide, roadmap ang version changelog is available at Pretius GitHub repository.

Live demo

Predefined templates

To use predefined templates the plugin attribute "Render validation result" must be set to proper value.

Error text only

The example presents how "Error text only" template displays validation result. If APEX item validation fails, the validation message is displayed after label.

#ERROR_MESSAGE#

Error text and icons after field

The example presents how "Error text and icons after field" template displays validation result.

  • If APEX item validation fails, the validation message is displayed after label and failure icon () is placed after text field.
  • If APEX item validation ends successfully the success icon () is placed after text field

#ERROR_MESSAGE#

Error text and highlight field

The example presents how "Error text and highlight field" template displays validation result.

  • If APEX item validation fails, the validation message is displayed after label and the text field is highlighted with red.
  • If APEX item validation ends successfully the text field is highlighted with green.

Highlights colors can be changed by overriding CSS classes "pretius_highlight_error" and "pretius_highlight_success".

#ERROR_MESSAGE#

Callback function

In this example validation result is handled by custom callback function defined with JavaScript in the plugin dynamic action.

  • If validation fails, the text field color text is changed to red and validation message is displayed after label.
  • If validation ends successfully, the text field color is changed to black (default color).
#ERROR_MESSAGE#

Depended validations

In this example you can see standard user registration form. To finish registration, user has to fill e-mail address field and confirm its value in confirmation field.

The field "E-mail confirmation" depends on "E-mail" because of validation rules (value of "E-mail confirmation" must be equal to value of "E-mail"). The dependency is used by the plugin to auto-validate "E-mail confirmation" item after "E-mail" item validation ends.

#ERROR_MESSAGE#
#ERROR_MESSAGE#

Native validations

In this example we present APEX validation defined in APEX item configuration. Validation for text field is executed after leaving the field and changing checkbox. Each APEX item displayed below has Value Required attribute set to Yes, so empty values are not allowed.

#ERROR_MESSAGE#
#ERROR_MESSAGE#
Expected format: YYYY-MM-DD[Null value], [Invalid value], [Valid value]
#ERROR_MESSAGE#

Events

In this section we present how to use plugin events to track (via log) validation sequence. Each event has access to JSON object that can be used to handle validation step. To get more information about plugin events, please refer to the plugin manual.

Examples

#ERROR_MESSAGE#
#ERROR_MESSAGE#
#ERROR_MESSAGE#

Event logs

Placeholders

The plugin supports four positions for displaying validation error message (After label, Before label, After item, Before item). In Oracle APEX Universal Theme default position is After item. If you want to use positions After label, Before label or Before item you have to create new label templates (check section Label templates for cheat sheet).

Examples of all configured positions are presented below. Each APEX item has proper label template (definitions in section Label templates). Validation results after submit and validation results after executing the plugin are presented at the same spot. Just test it!

Left column

#ERROR_MESSAGE#
#ERROR_MESSAGE#

Right column

Download

Please click on the button below

 

About the author

Bartosz Ostrowski
Bartosz Ostrowski

Oracle Application Express, PL/SQL and Frontend developer. IT consultant experienced in developing database and web applications using Oracle Application Express.
Oracle APEX enthusiast, plugin developer and active community member.

release 1.0 Set Screen Reader Mode Off