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
- You can define the number of rows and specify the type of input for each column
- Entering multiple records is easier and faster than using single-row forms.
- Multi-row forms can be more compact and organized than multiple single-row forms.
- Trigger PL/SQL code based on user interaction with the multi-row item, such as adding a new row or saving data.
- Conditional formatting IN which apply different styles to rows based on their content or other conditions.
- 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