Apex 3.2 group select list

Question

Hi,
I just want share this if you are still in older version of Apex and you use jQuery.
I did made "plugin" for grouped select list
See sample here
http://actionet.homelinux.net/htmldb/f?p=100:86
Plugin source
;(function(){
jQuery.fn.htmldbLovOptGrp=function(o){
var t=jQuery(this);
o=jQuery.extend({
  sessionValue:t.val(),
  nullShow:false,
  nullValue:'%null%',
  nullDisplay:'%',
  lovProcess:undefined,
  lovGrpLabel:'GRP',
  lovDisValue:'DIS',
  lovRetValue:'RET',
  loadingTxt:'Loading ...',
  loadingCss:{'width':'80px'}
},o);
return lCreSelect(t,o);
jQuery.htmldbAjax=jQuery.fn.htmldbAjax=function(opt){
jQuery.ajaxSetup({
  url:'wwv_flow.show',
  dataType:'HTML',
  traditional:true,
  cache:false,
  type:'POST',
  data:{
   p_flow_id:jQuery('#pFlowId').val(),
   p_flow_step_id:jQuery('#pFlowStepId').val(),
   p_instance:jQuery('#pInstance').val()
return jQuery.ajax(opt);
jQuery.htmldbJSON=jQuery.fn.htmldbJSON=function(opt,callfn){
return jQuery.htmldbAjax({dataType:'json',data:opt,success:callfn});
function lCreSelect(t,o,j){
t.empty().hide().parent().append(jQuery('<div/>').html(o.loadingTxt).addClass('ui-autocomplete-loading').css(o.loadingCss));
jQuery.htmldbJSON(jQuery.extend(j,{p_request:'APPLICATION_PROCESS='+o.lovProcess}),function(jd){
  if(o.nullShow){lAppendOpt(t,null,o.nullDisplay,o.nullValue);}
  jQuery.each(jd.row,function(i,d){lAppendOpt(t,d[o.lovGrpLabel],d[o.lovDisValue],d[o.lovRetValue]);});
  t.val(o.sessionValue).trigger('change').show().parent().find('div.ui-autocomplete-loading').remove();
  return t;
function lAppendOpt(t,l,d,r){
var o=lCreateOpt(d,r);
if(l){
  var g=lGetOptGrp(t,l);
  if(g){g.append(o);}
  else{t.append(lCreOptGrp(l).append(o));}
}else{t.append(o);}return true;
function lExists(p){return(p.length==1);}
function lCreateOpt(d,r){return jQuery('<option/>').val(r).html(d);}
function lCreOptGrp(l){return jQuery('<optgroup/>').attr({'label':l});}
function lGetOptGrp(t,l){var g=t.find('optgroup[label="'+l+'"]');if(lExists(g)){return g;}else{return false;}}
})();Copy code and save it to file e.g called jquery.htmldbQuery.js and upload it to workspace Static Files.
Create new page and blank HTML region.
Create select list with LOV query
SELECT null d, null r FROM dualCreate On Demand application process called GET_GRP_LOV like
DECLARE
l_sql VARCHAR2(32700);
BEGIN
l_sql :='
  SELECT mgr AS grp,
   ename AS dis,
   empno AS ret
  FROM emp
APEX_UTIL.JSON_FROM_SQL(l_sql);
END;Place to page HTML header
<script type="text/javascript" src="#WORKSPACE_IMAGES#jquery.htmldbQuery.js"></script>
<script type="text/javascript">
$(function(){
$('#Px_MY_SELECT').htmldbLovOptGrp({lovProcess:'GET_GRP_LOV'});
</script>Where Px_MY_SELECT is your select list name.
As I did say this need you also load jQuery. Apex 4 have jQuery , but if you are on later version see e.g. this blog post
http://www.oracleapplicationexpress.com/tutorials/66
I hope this helps someone
Br,Jari
Edited by: jarola on Aug 17, 2010 8:44 PM
Same thing seems to be work also with Apex 4.0
http://apex.oracle.com/pls/otn/f?p=40323:50
But if I have understand correctly Apex 4.0 have some build in or better thing to get same result
Edited by: jarola on Aug 17, 2010 10:54 PM
copy&paste mistake corrected
Edited by: jarola on Aug 18, 2010 12:57 AM
I hope editing post all the time is ok =).
I have not test this on any other browser than Fire Fox, so all comments are welcome.
Also I have try create similar plugin for cascading lov. Sample here
http://actionet.homelinux.net/htmldb/f?p=100:85
Maybe there is this kind plugins already for Apex 3.x, I have not just seen.
Also I'm beginner with jQuery so all help and comments is needed
Edited by: jarola on Aug 18, 2010 2:01 AM
mistake in guide corrected.

Answer 1

Hi Matt,
which version of APEX are you currently on?
With ApexLib Framework you can have cascading select lists in normal forms, but not in a Report or Tabular Form. Also refreshing a Report when changing a select list doesn't work out of the box. You would need to add some javascript. But i think this isn't what you wanted.
brgds,
Peter
Blog: http://www.oracle-and-apex.com
ApexLib: http://apexlib.oracleapex.info
BuilderPlugin: http://builderplugin.oracleapex.info
Work: http://www.click-click.at