Accessing LOV in Javascript

Question

Hi Everyone,
I'm on Apex 4.1.1 and I have this requirement.
I have a form where there are multiple select lists and radio buttons which the user uses to configure features of a particular object being created using that form.
I also have to show a text string that changes dynamically based on the currently made selections to give the users a description of what they have selected.
I have used javascript to do this and it works fine. However I need help in one feature.
I have 4 select lists that list colours. Now these colours have abbreviations (for e.g. WHITE -> WHT) which I need to add in the text description. But these abbreviations are available only in a table. I have to get these to the front end for which I thought I'll use a LOV which gets it from the table.
I want to know if there is a way to access this LOV in a page javascript. If so then how do I do it?
Any help would be appreciated.
Regards,
Arijit
Edited by: Arijit Kanrar on Feb 7, 2013 12:24 PM
Edited by: Arijit Kanrar on Feb 7, 2013 12:25 PM

Answer 1

Example for EMP/DEPT:
Create a PLSQL region with source:
htp.p('<script type="text/javascript">');
htp.p('var gaDepartments = ');
apex_util.json_from_sql(q'!
select deptno, dname, loc
from dept
htp.p(';');
htp.p('</script>');This will create an array stored in a global variable.
I have a tabular form with sql
select
"EMPNO",
"EMPNO" EMPNO_DISPLAY,
"ENAME",
"HIREDATE",
"SAL",
"DEPTNO"
from "#OWNER#"."EMP"I changed column "DEPTNO" to be based on an LOV so that a select list is generated and the DNAME column is used as display column.
I then bind to the onchange event
$("td[headers='DEPTNO'] select").change(function(){
   var lFind = $(this).val();
   $(gaDepartments.row).each(function(){
      if(this.DEPTNO==lFind){
         alert(this.DNAME + ' is located in ' + this.LOC);
         return false;
});This will iterate over the objects in the array until it has found the entry associated with the value now selected in the list and alert the dname and loc. Mind the capitalised member names as they are case sensitive.
Let's say i did this on a page item select list and want to affect another page item. I'd create a dynamic action which fires on change of the select list item. Execute javascript as true action:
   var lFind = $(this.triggeringElement).val();
   $(gaDepartments.row).each(function(){
      if(this.DEPTNO==lFind){
         alert(this.DNAME + ' is located in ' + this.LOC);
         $(this.affectedElements).val(this.DNAME);
         return false;
   });Set the item to be affected in the affected elements region.
This should allow you to set it up, given that you understand a bit of javascript/jquery and dynamic actions. Otherwise, set up an example on apex.oracle.com!