APEX

Removal of close button from Select2 plugin

Requirement: The users who completed their tasks in selected Delivery PDVD must not be deleted from team allocation. Select2 plugin was used for selecting multiple users, which will have a cross button to remove the users. The cross button must be disabled for the users who completed their tasks in the selected Delivery PDVD Challenges faced: Select2 is an external plugin for selecting multiple values at a time. On default plugin don’t have any option to remove the close button. Solution: 1. Created a page level item to get all the completed users for selected Delivery PDVD. 2. Created a dynamic action with event as on Page load and called a JavaScript function. 3. Added JavaScript code in the page header to check the users from the previous page item and removed the close icon. function remove_close() { var a=$(“#P94_ROLE”).val(); //alert(a); if (a.length!=0) { var numbers = a.toString().split(‘,’); for(var i = 0; i < numbers.length; i++) { var b=numbers[i]; $(“ul.select2-choices li”).each(function(){ var s= $(this).text(); s=s.trim() if (s==b) { var z=$(this).find(“div”).next().removeClass(“select2-search-choice-close”); //alert(‘s = ‘+s); } …

HOLD / UNHOLD in APEX Report

In Report Attributes, Call below function in link – URL function fun(a) { //alert(a); var str = a.substring(4); // alert(str); str =…

Key Controlled Report View in APEX

Every application all over world is in fond of key controlled or having shortcuts to report view. I have implemented this with some Javascript. Step:1: By Default , report should not be visible , So we have added attribute to region as: Region Attributes : style= “display:none;” Step: 2: Create a new html region and following javascript code for key recognition and report view : [Shortcut Key: Ctrl+S] <html> <head> <script> function test(e) { e = e || window.event; //Get event if (e.ctrlKey) { var c = e.which || e.keyCode; //Get key code switch (c) { case 83:// Block Ctrl+S e.preventDefault(); // Prevents Default Fuctionality e.stopPropagation(); $(“#TEST_REPORT”).dialog(); // Opens Dialog } } }; </script> </head> <body onkeydown=”javascript:test(event);”> </body> </html>

Global Alert Box in APEX

GLOBAL ALERT BOX is developed as we need customized alert boxes all over application. A region created in global page and been referred in dialog box wherever been called. Step:1: Create region in global page with Static ID. For Example: alert. Step:2: For alert box, JQuery Dialog been called.Alert messages can be dynamically changed and customized. $(“#alert”).html(“Blank row already exists. Hence cannot add row”); // .html() – Dynamically we can change content of region $(“#alert”).dialog({modal:true,resizable: false,minHeight: 105,width:380,dialogClass: ‘testclass’}); //$(“#alert”) – Global region referred for dialog. Output: You can notice change of message dynamically.

Full View/ Normal View of Tabular Form Columns in APEX

Step:1: Create relation between table header and table data <td class=”t-Report-cell” rel=”#COLUMN_HEADER_NAME#” #ALIGNMENT# headers=”#COLUMN_HEADER_NAME#”>#COLUMN_VALUE#</td> Step:2: Normal View Functionality: Show / Hide required columns on-click Order the Columns accordingly, 1.Create Button with dynamic action as Execute Javascript Code, 2. For Example, If you have 25 columns, Arrange first 6 as your main visible columns and so that you can form a loop and hide after 6, Use following Jquery inside your loop var a = $(‘.t-Report-report’).find(“td:eq(“+i+”)”).attr(“rel”); $(‘.t-Report-report’).find(“th:eq(“+i+”), td:eq(“+i+”)”).hide(); $(‘td[rel=’+a+’]’).hide(); i Represents the nth column of <table> .t-Report-report Class of the report .find Finds the selector specified in braces td:eq(“+i+”) equals (eq) nth(i) table data(td) .attr(“rel”) Finds attribute rel .hide() Hides the selector Step:3:…

Dynamic addition of data on clicking of link in a pop-up

Step:1: On Click of tabular form column of parent report, execute below javascript code to open pop-up with latest modification of parent report Dynamic Action Event : Onclick Selection type : JQuery Selector Execute Javascript Code, var i = 1; var a = “”; var b = “”; var c= “”; while (i != 0) { b = “000” + i; b = pad(i,4); a = $(“#f10_” + b).val(); if (typeof a === “undefined”) { i = 0; } else { if (a==’U’) { $(“#f11_” + b).val(“”); //alert($(“#f02_” + b).val()); c=c+”^~”+$(“#f03_” + b).val()+”|~”+$(“#f05_” + b).val()+”|~”+$(“#f06_” + b).val()+’|~’+$(“#f07_” + b).val()+’|~’+$(“#P77_MASTER_PDVD_ID”).val(); } i=i+1; } } var get = new htmldb_Get(null,$x(‘pFlowId’).value, ‘APPLICATION_PROCESS=AP_REP_VAL’,0); get.add(‘AI_UNIQ_VAL’,c); gReturn = get.get();…

Conditional Link in APEX Tabular Form

Conditional link is the common requirement all over application development. As requirement goes with Users and Roles, Conditionally we may have to hide / disable link for different users and roles. Form level it will be easy. But when comes to tabular form, it is somewhat typical. I have done this in tabular form with JQuery, without using any loop which will lead to performance issue. It has been done as Role-based Conditional link. Step:1: Maintain hidden column in tabular form to maintain role against each entry. Step:2: In Page Load and after refresh event include this Execute Javascript code event $(“#report_del_item .t-Report-report td[headers=’GENERAL_COMMENTS’]”) .each(function(){var a = $(this).children(“input[name=’f15′]”).val(); if (a ==’Developer’ || a ==’Validator’ || a ==’Reviewer’) { $(this).closest(‘tr’).find(“td[headers=’TITLE’] a”).attr( “href”, “javascript:void(0);”).css({“cursor”:”default”,”color”: “black”}); } }); #report_del_item – Static Id of Report. td[headers=’GENERAL_COMMENTS’] – Represents General Comments Column $(this).children(“input[name=’f15′]”) – Represents role hidden column …

Conditional Alert / Comments on Hover

Conditional Alert / Comments on Hover is common requirement, In Old days, it is common to use drill-down pop-up user has to click and view comments and after that he has to close it. If he had 100 records it takes time to click and check on it. Instead of Click, It is better to visualize comments / alert on hover. Step:1: In Link / Element Attributes, we can call function on mouse hover using javascript as follows: onmouseover=”fun_status(#DELIVERY_ITEM_ID#,#DELIVERY_PDVD_ID#);” Step:2: In function we will check our condition and display it conditionally. It is simple, But we used it for field locks as user can be restricted to click on link when other user is using it , during hover itself we will alert him and restrict. Following javascript is used to check whether particular field is locked or not and we will conditionally alert them or allow in accordance to condtion function fun_status(a,b) { var get = new htmldb_Get(null,$x(‘pFlowId’).value, ‘APPLICATION_PROCESS=AP_DEL_OUTPUT_CHECK’,0); get.add(‘AI_PDVD_ID’,a); get.add(‘AI_DELIVERY_PDVD_ID’,b); gReturn = get.get(); var x=gReturn; x = x.trim(); //alert(x); if (x != “Not Exists”) { $(“#alert”).html(“Field has been locked by <b>”+x+”</b>”); $(“#alert”).dialog({modal:true,resizable: false,minHeight: 105,width:380,dialogClass: ‘testclass’}); } } $(‘#alert’).on(‘dialogclose’, function(event) { $(“#alert”).dialog(“destroy”); }); Output:

Comments Differentiation in Oracle APEX

Comments Differentiation is some recent requirement as new advancements in CSS been implemented. Customer requires differentiation in Image when some comment been added. It has been implemented with css and little Jquery. Step:1: Include following icon tag in Link Text in report column attributes <i class=”fa fa-comments-o fa-3x icon-grey” aria-hidden=”true”></i> Step:2: Create hidden column to find comments exists for particular row. Step:3: Include following JQuery for color differentiation: Create Dynamic Action as Execute Javascript Code Event : After Refresh and Page Load $(“#report_del_item .t-Report-report td[headers=’GENERAL_COMMENTS’]”).each(function(){ var c = $(this).children(“input[name=’f17′]”).val(); if (c.length != 0) { $(this).closest(‘tr’).find(“td[headers=’GENERAL_COMMENTS’] a”).children(“i”).css({“color”:”red”}); } }); #report_del_item – Static Id of Report. td[headers=’GENERAL_COMMENTS’] – Represents General Comments Column $(this).children(“input[name=’f15′]”) – Represents general comments hidden column , Children been specified as all hidden columns will be children to last visbile/display column. .closest(‘tr’) – Finds closest table row <tr> .children(i) – Represents child icon tag inside parent general comments .css – Adds style element to selector Output: You can notice General Comments to see Comments Differentiation

Blank Row Restriction in Oracle APEX

Blank Row Restriction is to avoid unwanted addition of rows in detail report (tabular Form) when a blank row already exists. This functionality can be achieved by Javascript. It is simple but can be reused everywhere. Step:1: Change Add Row Button action as “Defined by Dynamic Action” Step:2: Create Dynamic Action with action as Event : Click Button Action : Execute Javascript Code Code : var i = 1; var count = 0; var c; while (i != 0) { b = “000” + i; //alert(b); b = pad(i,4); // calls function pad and pads 4 zeros a = $x(“f05_” + b).value; // id of mandatory column //alert(a); if (typeof a === “undefined”) { i = 0; } else { c = a.trim(); if (c.length == 0) { count = count + 1; } else { count = 0; } i = i + 1; } }…

We take you from best practices to next practices of software implementation

Solutions that Ensure You Stay Ahead of Competition

Your Partner for Strategic Technology Solutions

Guiding Your Digital Transformation Journey