Hi Folks,
This is my first blog
and very much intended to share some knowledge on oracle apex. Well, I am just
new to blogging and stuff and still in learning process to give clear and
better explanation of the concepts which might be useful in your apex development.
Let me start with
creating custom super LOV in Oracle Apex 5.0.
As we all know skill builders
super LOV is available to achieve this objective but due to license and
compatibility issues with apex 5.0 and later versions , it’s always better to
create your own custom LOV and use it to have a better hold on the way you want
the LOV to be displayed.
The basic idea is to
make popup LOV appear similar to inbuilt apex popup LOV with multiple
columns.
Version: Apex 5.0
- Firstly, Create the modal popup
page with interactive report having specific LOV query
- In primary key column
attributes, Specify the code as below in HTML expression section.
#EMPNO#
<input
class="return-val" style="display:none;"
value="#EMPNO#">
In my case EMPNO is the
primary key as I am using EMP table.
·
Apply
the css code to make the row pointer as cursor in inline section of the
template.
.t-fht-tbody tr{
cursor: pointer;
}
Well, simple isn't it :)
- Now, Create dynamic action to
have an event for row click and passing the corresponding row key value to
the popup text field in the parent page.
Event : Click
Selection type :jquery selector
Action : Execute Javacript code
code : var columnStaticId = 'EMPNO';
var displayTd =
$(this.triggeringElement).closest('tr')
.find('td[headers=' +
columnStaticId + ']');
var
returnVal = displayTd.find('.return-val').val();
$s('P4_LOV',returnVal);
apex.submit('EMP_DISPLAY');
1.
EMPNO
is the static ID of the empno (primary key) column which can be specified in
column attributes.
2.
P4_LOV
is the hidden item which is used to store the clicked row primary key value.
3.
apex.submit
is used to have a dialog close process to close the dialog on click of report
row.
- Create dialog close after
submit process with condition as "request = expression1"
and request is "EMP_DISPLAY"
- Specify item P4_LOV in page
items to return section of dialog close.
Easy peasy !!!!
Now that we are done with popup lov window
changes, let’s work on parent page from where popup LOV is initiated.
- Create popup LOV button like
appearance by applying code below in post element text section in page
item(textfield).
<a class="a-Button
a-Button--popupLOV lov-open" onclick="openPopupLOV('ITEM_LIST')"
aria-label="Open List of Values" title="Open List of
Values" href="javascript:void(0);" target="_blank">
<span
class="a-Icon icon-popup-lov"></span>
</a>
- Copy this function
in page template js section (basically used to call the popup window which
we created) . You can set the dynamic request so that it can be used to
call in multiple places with different set of LOV's based on
request.(currently i've used static request).
function
openPopupLOV(pReq)
{
apex.navigation.redirect("f?p=&APP_ID.:4:&APP_SESSION.:EMP_LIST::4:");
}
- Create dynamic action for
setting selected value to text field on dialog close.
Event : Dialog close
Selection type : Javacript expression
Javascript expression : window
Action : Execute PL/SQL code
Code: :P2_LOV := :P4_LOV;
1.
Here
P2_LOV is the textfield(Popup LOV).
2. Specify
P4_LOV in page items to submit and P2_LOV in page items to return section.
Done!!
Here we go!! .You have
just created custom super LOV.
Hope it helped :)
Cheers.