Overview

The APEX-Multi Row-Item-Plugin is a free and open-source plugin for Oracle Application Express (APEX) that allows you to create multi-row input fields within your applications. This could be part of a larger functionality, such as a multi-row form, a tabular form, or an interactive grid where users can manage or input data across multiple rows.

Technologies and Tools Used

The following technologies has been used to achieve the same.

  • Oracle APEX

Use Case

  1. You can define the number of rows and specify the type of input for each column
  2. Entering multiple records is easier and faster than using single-row forms.
  3. Multi-row forms can be more compact and organized than multiple single-row forms.
  4. Trigger PL/SQL code based on user interaction with the multi-row item, such as adding a new row or saving data.
  5. Conditional formatting IN which apply different styles to rows based on their content or other conditions.
  6. Boosts productivity IN which users can input data more efficiently.

Architecture 

Step1: Create a Form With the name of FORM_WITH_MULTIROW and add the table named

EMP_DETAIL

 

Page Items

 

Type

 

P3_EMPLOYEE_ID

 

Text Field

P3_EMPLOYEE_NAME Password
P3_ADDRESS Apex Multi Row Item Plugin
P3_PHONE Text Field

 

Step2: Import the Multi row plugin in the application

 

PROCEDURE Render_MultiRow_Item (

p_item     IN apex_plugin.t_page_item,

p_plugin   IN apex_plugin.t_plugin,

p_param    IN apex_plugin.t_item_render_param,

p_result   IN OUT NOCOPY apex_plugin.t_item_render_result

)

IS

lb_read_only           p_param.is_readonly%type := p_param.is_readonly;

lv_read_only           varchar2(100);

lb_is_printer_friendly p_param.is_printer_friendly%type := p_param.is_printer_friendly;

ln_item_max_length     p_item.element_max_length%type := p_item.element_max_length;

ln_item_size           p_item.element_width%type := p_item.element_width;

lv_item_name           varchar2(1000) := apex_plugin.get_input_name_for_page_item(false);

lv_format_mask         p_item.format_mask%type := p_item.format_mask;

lv_item_css            varchar2(1000);

lv_item_placeholder    p_item.placeholder%type := p_item.placeholder;

lv_js_code             varchar2(4000);

ln_limit               p_item.attribute_01%type:= p_item.attribute_01;

lv_limit_message       p_item.attribute_02%type:= p_item.attribute_02;

lv_add_icon            p_item.attribute_03%type:= p_item.attribute_03;

lv_remove_icon         p_item.attribute_04%type:= p_item.attribute_04;

Begin

 

IF lb_read_only

THEN

lv_item_css := ‘display_only apex-item-display-only multiRow-displayOnly’;

lv_read_only := ‘true’;

ELSE

lv_item_css := ‘text_field apex-item-text’;

lv_read_only := ‘false’;

END IF;

 

IF apex_application.g_debug

THEN

apex_plugin_util.debug_page_item (p_plugin                => p_plugin,

p_page_item             => p_item,

p_value                 => p_param.value,

p_is_readonly           => lb_read_only,

p_is_printer_friendly   => lb_is_printer_friendly);

END IF;

 

 

sys.htp.prn(‘<textarea type=”text” id=”‘||lv_item_name||'” name=”‘||lv_item_name||'” class=”text_field apex-item-text” value=”” size=”” maxlength=””>’||sys.htf.escape_sc(p_param.value)||'</textarea>’);

 

lv_js_code := ‘$(“#’||lv_item_name||'”).apexMultiRow({itemPlaceholder: “‘||lv_item_placeholder||'”,

itemSize: “‘||ln_item_size||'”,

itemCss: “‘||lv_item_css||'”,

itemMaxLength: “‘||ln_item_max_length||'”,

readOnly: ‘||lv_read_only||’,

limit: “‘||ln_limit||'”,

limitMessage: “‘||lv_limit_message||'”,

addItemIcon: “‘||lv_add_icon||'”,

removeItemIcon: “‘||lv_remove_icon||'”});’;

apex_javascript.add_onload_code (lv_js_code);

 

Step 3: In the Address page item we are choosing the multi row item plugin:

 

 

Conclusion 

The APEX-Multi Row-Item-Plugin is a powerful and versatile tool that significantly improves user experience and data entry efficiency for scenarios involving multiple records. Its dynamic capabilities, validation tools, and ease of use make it a valuable addition to any developer’s toolkit.

Screenshots

The Address column in which we have a icon (+) symbol we can add extra rows and add extra information

 

 

 

 

 

 

The Address column in which we have a icon (+) symbol we can add extra rows and add extra information

Recent Posts

Start typing and press Enter to search