Step by step to try AJAX Select LIST

Question

Hi Pakars
Please describe step by step,
how to create Ajax Select list ?
Refer in this
http://apex.oracle.com/pls/otn/f?p=11933:37:8080121466477345
Thanks

Answer 1

Hi,
I use these instructions to create an AJAX lov, hope they help
1 - Under shared components create an item called TEMPORARY_ITEM
2 - Under shared components create an application process
declare
l_counter number;
l_o_name varchar2(2000);
begin
owa_util.mime_header('text/xml', FALSE );
htp.p('Cache-Control: no-cache');
htp.p('Pragma: no-cache');
owa_util.http_header_close;
htp.prn('<select>');
for rec in (select VALUE_HEADER_ID as "VALUE_HEADER_ID",
LOV_VALUE as "LOV_VALUE",
LOV_VALUE_ID as "LOV_VALUE_ID"
from TST_LOV_VALUES Where VALUE_HEADER_ID = :TEMPORARY_ITEM )
loop
htp.prn('<option value="' || rec.LOV_VALUE_ID || '">' || rec.LOV_VALUE || '</option>');
end loop;
htp.prn('</select>');
end;
Change the select in bold to match the sub LOV
3 - Add the following javascript to the html header of the page
<script language="JavaScript" type="text/javascript">
<!--
htmldb_delete_message='"DELETE_CONFIRM_MSG"';
function get_AJAX_SELECT_XML(pThis,pSelect,pName,pNullDefault){
var l_Return = null;
var l_Select = html_GetElement(pSelect);
var get = new htmldb_Get(null,html_GetElement('pFlowId').value,pName,0);
get.add('TEMPORARY_ITEM',pThis.value);
gReturn = get.get('XML');
if(gReturn && l_Select){
var l_Count = gReturn.getElementsByTagName("option").length;
l_Select.length = 0;
if ( pNullDefault == true )
appendToSelect(l_Select,'','') ;
for(var i=0;i<l_Count;i++){
var l_Opt_Xml = gReturn.getElementsByTagName("option");
appendToSelect(l_Select, l_Opt_Xml.getAttribute('value'), l_Opt_Xml.firstChild.nodeValue)
get = null;
function appendToSelect(pSelect, pValue, pContent) {
var l_Opt = document.createElement("option");
l_Opt.value = pValue;
if(document.all){/* why is ie different ask bill */
pSelect.options.add(l_Opt);
l_Opt.innerText = pContent;
}else{
l_Opt.appendChild(document.createTextNode(pContent));
pSelect.appendChild(l_Opt);
//-->
</script>
4 - Create the first LOV abd in the HTML Form Element Attributes add the following text
onblur="get_AJAX_SELECT_XML(this,'P2_CHILD','APPLICATION_PROCESS=CHILD_Select_XML',false)"'
5 - Create the sub lov
Ensure the List of values definition relates to the main lov in the where clause e.g.
select LOV_VALUE d, LOV_VALUE_ID r
from TST_LOV_VALUES
where VALUE_HEADER_ID = :P2_HEADER