AJAX Select list implementation

Hi,
I'm trying to implement the AJAX Code Generator from Scott ( http://htmldb.oracle.com/pls/otn/f?p=33867:2 ) using dept no select list and dept name text field. When I change the Dept# selection from the options, all I get is a huge chunk of html code in my dept name text field and it doesn't contain the result.
Can any one help me out with what i'm doing wrong?
Thanks.
- Richard

Carl,
Thanks for helping me out.
Important thing I missed to mention in my original post.... I'm using HTMLDB ver 1.6 copied the js files needed, from htmldb.oracle.com
Here is the url for the page I created in htmldb.oracle.com. But, when I recreated it, the onchange gets me "null" in department name field instead of huge chunk of HTML code.
http://htmldb.oracle.com/pls/otn/f?p=19793:24:

Similar Messages

How to set "Display as Text" field with AJAX select list

thanks Denes for your posting. I'm trying to use the Denes Kubicek code to populate a "Display as Text" field. It works for Text Field (disabled), but not "Display as Text" field(saves state) . In my applciation I need to show this field only (not the disabled text box) when a select list value is changed. any ideas to modify the code below are appreciated.
http://htmldb.oracle.com/pls/otn/f?p=31517:80:3418128396960418::NO
here is the code from the url above
1. Create an Application Process - getDet:
DECLARE
my_det VARCHAR2 (200);
BEGIN
SELECT ename || CHR(10) || job || CHR(10) || mgr
INTO my_det
FROM emp
WHERE empno = :P80_EMPLOYEES;
HTP.prn (my_det);
END;
2. Put the following in the Region Header of your page:
<script language="JavaScript" type="text/javascript">
function f_getDet ()
var get = new htmldb_Get(null,&APP_ID.,'APPLICATION_PROCESS=getDet',0);
get.add('P80_EMPLOYEES',html_GetElement('P80_EMPLOYEES').value)
gReturn = get.get();
if(gReturn)
{ html_GetElement('P80_DETAILS').value = gReturn }
else
{ html_GetElement('P80_DETAILS').value = 'null' }
get = null;
</script>
3. Put the following in the HTML Form Element Attributes of :P80_EMPLOYEES:
onChange="f_getDet()";

Arie,
this works fine on normal page, except page zero. I have the AJAX select list and "Display as Text" field on page zero. The "Display as Text" field doesn't show the the value when AJAX select is changed. I'm using similar code as used in my other APEX page on OTN site. I tired to display the gReturn value, just before calling "setDisplayOnlyNode" function in the code below and it's showing correct value, but fails to display the value in the APEX field on page zero. Any ideas are appreciated.
Thanks,
Surya
<script language="JavaScript" type="text/javascript">
function setDisplayOnlyNode(pItem, pValue)
{ var textNode = pItem + '_DISPLAY'; $x(textNode).innerText = pValue; }
function f_getDet ()
var get = new htmldb_Get(null,&APP_ID.,'APPLICATION_PROCESS=getDet',0);
get.add('P1_EMPLOYEES',html_GetElement('P1_EMPLOYEES').value)
gReturn = get.get();
if(gReturn)
{ setDisplayOnlyNode('P1_DETAILS',gReturn)}
{ html_GetElement('P1_TEST').value = gReturn }
get = null;
</script>

Step by step to try AJAX Select LIST

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

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">

</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

Ajax select list with an updateable report

Hi,
I have an updateable report where the first 3 columns are all select lists and where the values in each of the select lists are dependent on the value selected in the previous select list.
I've been able to implement this for the first 2 columns using ajax ie. the values in the select list for the second column are based on what value has been selected in the first column, but I have not been able to apply the same logic to the list of values for the 3rd column, which should be based on what has been selected in the second column.
Also, when the value of the first column is changed, it should be blanking out the values of the 3rd column, until the new second column value has been selected, based on the change to the value of the first column.
Any assistance/advice would be much appreciated.
Many Thanks,
Marquita

How did you do that for the fisrt 2 columns, I could only do it in a form not in a report, appreciate your help

Slight AJAX select list issue, hopefully....

I have probably looked at every example that uses AJAX to populate select lists that is out there and finally got one almost completely working.
In my app I use a Form on page 23 to create a record and then also use a form on page 22 to update a record. On both of these pages i have 2 select lists that use AJAX to populate each other. On my Create Form page, these two select lists display properly and submit properly to a report page.
Now, when i click on that record that i just created from the report page, i am taken to the update page(page 22) where all items that i just submitted are properly displayed except the second select list. The second select list does display the correct list of items within the select list, just not the one that i had just selected. What is being displayed is the very first option in the select list, no matter what i had selected when i created the record. What in my code would always make the first option display no matter what?
Thanks
Deanna
For example:
My current ouput:
Pg.23(Creating the record)
Parameters:
:P23_CASE_NUMBER--------------------------9999999999
:P23_CONT_FACTOR_CATEG--------------Driver Distracted By
:P23_CAUSES-----------------------------------Other Electronic Devices
Pg.22(Updating the record)
Parameters:
:P22_CASE_NUMBER--------------------------9999999999
:P22_CONT_FACTOR_CATEG--------------Driver Distracted By
:P22_CAUSES-----------------------------------Mobile(cell)phone(WRONG)(First option in list)
Output I should see:
Pg.23(Creating the record)
Parameters:
:P23_CASE_NUMBER--------------------------9999999999
:P23_CONT_FACTOR_CATEG--------------Driver Distracted By
:P23_CAUSES-----------------------------------Other Electronic Devices
Pg.22(Updating the record)
Parameters:
:P22_CASE_NUMBER--------------------------9999999999
:P22_CONT_FACTOR_CATEG--------------Driver Distracted By
:P22_CAUSES-----------------------------------Other Electronic Devices(CORRECT)
Current code from page 22(Update Page):
This is from the Header HTML
<script language="JavaScript1.1" type="text/javascript">
function get_TASK_SELECT_XML(pThis,pSelect){
var l_Return = null;
var l_Select = $x(pSelect);
var get = new htmldb_Get(null,$x('pFlowId').value,
'APPLICATION_PROCESS=TaskXML',0);
get.add('WORK',pThis.value);
gReturn = get.get();
gReturn = get.get('XML');
if(gReturn && l_Select){
var l_Count = gReturn.getElementsByTagName("option").length;
l_Select.length = 0;
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){
pSelect.options.add(l_Opt);
l_Opt.innerText = pContent;
}else{
l_Opt.appendChild(document.createTextNode(pContent));
pSelect.appendChild(l_Opt);
</script>
This is the application process - TaskXML
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>');
htp.prn('<option value="' || -1 || '">' || ' - Select-' || '</option>');
for rec in (select cause , cause
from cause where categ = :WORK)
loop
htp.prn('<option value="' || rec.cause_number || '">' || rec.cause || '</option>');
end loop;
htp.prn('</select>');
end;

Hello Deanna,
Is the "select cause, cause" statement a typo?
for rec in (select cause , cause
from cause where categ = :WORK)
loop
htp.prn('<option value="' || rec.cause_number || '">' || rec.cause || '</option>');
end loop;
htp.prn('</select>');
end;If not, the list you're seeing could possibly be the result of the LOV defined for P22_CAUSES, assuming there is one.
- Alwyn

AJAX Select Lists on Updateable Reports

All,
I have followed the examples from Karl and Sergio's blog on how to use AJAX to contol dependent LOV lists in a form. My question is, can this be done in an updateable report? I'm having difficulty in determining how to reference the column names of the dependant lists.
What I basically have is a time app. User selects his project from a picklist and then his associated tasks for that project will appear in the task list. I have used the updatable report option to build this rather then a form, because I liked the prebuilt add row and processing functionality.
Anyway if anyone knows how to use AJAX dependant select lists in an updateable report it would be greatly appreciated.
Thanks
Rob

See http://forums.oracle.com/forums/thread.jspa?messageID=1222153&#1222153

Dynamic Parent/Child Select List - Parent may have only a single entry

Hello,
I have a parent/child select list implemented using APEX only, ie no AJAX.
The child list always has multiple entries, but the parent may only have a single entry, depending on who is running the application. When the parent has just one entry it can't submit, so the child list remains empty. Also when the parent has multiple entries, the user must select another entry from the parent list to cascade the child list.
I have put a button to fire the branching to same page submit, but this is a little clunky. Is there a way of cascading the child list when the page opens? Preferably without ajax, but if has to be then ok
I've looked for an answer to this but all threads I have followed seem to assume parent to have multiple entries, and that child list requires parent selection, but this not so in my application.
Thanks, Jock

Anyone?
Even an acknowledgment that this should be obvious to me, or that it is not currently possible would be of assistance.
Thanks,
Jock

SELECT LIST about...

Hello.
Is there any way to create multiple 'select list's. That each one depending on each other? There are three 'select list' in my case.
First - city
Second - department
Third - Person
Of course, if I change 'city' one I want other two to change automatically BUT - without reloading page! Is it possible? There are department with very low connection rate - often reloading page - is very expensive for them..

Why there is no answer? Are my question silly?Well...there are a few reasons for that -
1) It's the weekend
2) You have waited less than an hour for a reply.
3) Nobody is 'paid' to provide support on these forums, we all do it for free in our (limited) spare time (see point 1)
Yes what you have asked is achievable, take a look at the following blog posting by Scott Spendolini which you should be able to use and adapt
http://spendolini.blogspot.com/2005/10/ajax-select-list-code-generator.html

AJAX dependent Select lists

Can anyone please help me figure out where am going wrong?
I have 2 regions on page 1. Region 1 is supposed to have 2 drop down lists (cascading i.e values in second drop down Drop List HJ are dependent on value selected in first lov Ajax Select HJ). Region 2 will be a report.
I am trying to create AJAX cascading lovs based on eg. provided on carl's application so that Region 2 is not refreshed each time I select a value from the drop down's
[http://apex.oracle.com/pls/apex/f?p=36391:37:1510004986327720::NO:RP::]
I have downloaded the application and tried to do the exact same steps, but my child lov is not updating its values after I select a value from in Ajax Select HJ.
My application is available at http://apex.oracle.com/pls/apex/f?p=33829:1:2010637670427735:::::
Appreciate any help on this
Thank you
Deepu

Thank you Denes !! The example really helped me. Now I am stuck at the next level. I am new to apex and learning and building dashboard for my organization. So, please bear with me.
I have a page that is divided into 4 regions. Each region displays a chart that is generated dynamically. When I say dynamic, each region has 2 drop down lists.
First pull down has Org and Year as values, if they wish to view chart by Org or Year. If they choose Org, second drop down defaults to Org. If they choose Year, second drop down displays Year's as 2010, 2009,2008 so on. Depending on which year they choose they should be able to view that Year's chart by month in that region.
Initially I had used select lists with submit for drop down's but that was refreshing the whole page. But now after using your example with AJAX I was able to accomplish the cascading Lov's stuff. Now, after user selects a value in second drop down, is there a way that I can display the chart and refresh only that region each time user selects a value from the drop down.
I want to avoid refreshing the page each time, I need each region to refresh based on user selection in drop down's. Is this possible in apex? Is there any example that you could direct me to.
Thank you so much for all your inputs. Appreciate it very much
Deepu

Storing SELECT list definition after AJAX call

Hi all
I redefine the options in the SELECT item via AJAX call. The application process returns string similar to <option>x1</option><option>x2</option>, which is set as SELECT item innerHTML content. Everything works fine.
The problem is that I need to switch to another page and than return back. The original page is re-rendered and the redefinition of the SELECT item options is obviously lost.
Any recommentation how to solve it simply and robustly?
Thanks
Roman

I think i should do a Modal window, like described there:
http://oracleapexbynandinithakur.blogspot.com/2011/02/modal-form-in-apex.html
And after inserting a new record in Modal window user closes the Modal window with a button there, and i somehow then repopulate the underlying page's Select List component.

AJAX Dynamic Select List

Hello Ladies and Gentlemen,
I have a Select List, :P9_ELEMSTRUCTSAISIEPARCBO, based on a hidden item, :P9_NOSAISIEPAR, and this is the query it's based upon:
select Description, ElemStructID
from V_ElemStruct, V_Dispensateur
where DispensateurID = DispensateurIDResponsable
and NumeroDispensateur = :P9_NOSAISIEPAR
order by DescriptionI also have a popup page that shows a report with a column link that passes back values to the original page, and one of those values replace :P9_NOSAISIEPAR's current value. I want to reload the Select List via AJAX, so that the changes can be in real-time. I found Carl Backstrom's (He was a wonderful man) tutorial on his application (http://apex.oracle.com/pls/otn/f?p=11933:37) and decided to try it. But it just won't work, and I have no idea why.
I know the popup works just fine, and I tested the On Demand Application Process in the SQL Commands of the SQL Workshop and it seems to be working just as fine. Thus, I've narrowed it down to the thought that the JavaScript must be the problem, logically.
Here is the code for the "HTML Form Element Attributes" of the :P9_NOSAISIEPAR hidden item:
onChange="f_PopulateField(this,'P9_ELEMSTRUCTSAISIEPARCBO')"Here's my on Demand Application Process:
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
     Description as Description,
     ElemStructID as ElemStructID
   from
     V_ElemStruct,
     V_Dispensateur
   where
     DispensateurID = DispensateurIDResponsable
     and NumeroDispensateur = :F102_TEMP_APP_ITEM
   order by
     Description
) loop
htp.prn('<option value="' || rec.ElemStructID || '">' || rec.Description || '</option>');
end loop;
htp.prn('</select>');
end;and here's my JavaScript:
function f_PopulateField(pThis,pSelect)
var l_Select = $x(pSelect);
var l_Return = null;
var get = new htmldb_Get(null,$x('pFlowId').value,'APPLICATION_PROCESS=PopulateField',0);
get.add('F102_TEMP_APP_ITEM',pThis.value)
gReturn = get.get('XML');
if(gReturn && l_Select)
    var l_Count = gReturn.getElementsByTagName("option").length;
    l_Select.length = 0;
    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)
pSelect.options.add(l_Opt);
l_Opt.innerText = pContent;
else
l_Opt.appendChild(document.createTextNode(pContent));
pSelect.appendChild(l_Opt);
I have installed FireFox and FireBug, and I tried to debug my JavaScript, and that made me realize something. In the FireBug's HTML tab, :P9_NOSAISIEPAR doesn't have any onChange events mapped to it (and all my other items which should have an event mapped to them do have one).
<input type="hidden" id="P9_NOSAISIEPAR" value="2222" name="p_t63">compared to:
<select onchange="$f_Show_On_Value_Item('P9_SECURITAIRE','P9_NOTEACCOMPAGNATEUR',1)" id="P9_SECURITAIRE" size="1" name="p_t23">So, my best bet is that the JavaScript doesn't even get executed by the page at all (it's not appearing in FireBug's JavaScript tab at all either). Any idea why?
Best regards,
Mathieu

I finally found a way to do it. When selecting my value in my popup page, I show my hidden field, change the value, manually call the onChange event, hide back my hidden field, and then close the popup. That way the onChange event fires in IE. Afterwards, as a workaround to the XML not being recognized by IE, I changed
get.get('XML')for
get.get()to get a string instead of some XML, and I parsed it to XML DOM using a manual parser (because IE is too weak to have its own). Here is the code for the DOMParser.
if (typeof DOMParser == "undefined")
    DOMParser = function () {}
    DOMParser.prototype.parseFromString = function (str, contentType)
      if (typeof ActiveXObject != "undefined")
        var d = new ActiveXObject("MSXML.DomDocument");
        d.loadXML(str);
        return d;
      else if (typeof XMLHttpRequest != "undefined")
        var req = new XMLHttpRequest;
        req.open("GET", "data:" + (contentType || "application/xml") +
                         ";charset=utf-8," + encodeURIComponent(str), false);
        if (req.overrideMimeType)
          req.overrideMimeType(contentType);
        req.send(null);
        return req.responseXML;
}It wasn't written by me, I found it on Erik's Weblog (http://erik.eae.net/archives/2005/07/03/20.19.18/), so all credit goes to him.
Best regards,
Mathieu

Apex 4.0 Cascading Select List: ajax problem with german umlaute

Hi everybody,
Apex 4.0
Dad PlsqlNLSLanguage: GERMAN_GERMANY.WE8MSWIN1252
I have problems with german umlaute and ajax cascading select lists (Cascading LOV Parent Item).
The data is populated without a page refresh in the select list when the parent select list changes but special signs like german umlaute are shown as weird characters.
Seems like there is some charset problem with ajax.
This is the only part of the application where special signs like umlaute are messed up. Everything else is fine.
I allready tried to figure out if I can escape the umlaute in the javascript (file apex_widget_4_0.js) but no success here.
Can anybody help me with this issue?
Thanks in advance,
Markus

Hi Markus,
your specified character set in your DAD is wrong. As mentioned in the installation instructions at http://download.oracle.com/docs/cd/E17556_01/doc/install.40/e15513/otn_install.htm#CHDHCBGI , Oracle APEX always requires AL32UTF8.
>
3. Locate the line containing PlsqlNLSLanguage.
The PlsqlNLSLanguage setting determines the language setting of the DAD. The character set portion of the PlsqlNLSLanguage value must be set to AL32UTF8,
regardless of whether or not the database character set is AL32UTF8. For example:Regards
Patrick
My Blog: http://www.inside-oracle-apex.com
APEX 4.0 Plug-Ins: http://apex.oracle.com/plugins
Twitter: http://www.twitter.com/patrickwolf

Ajax code help for conditional select list.

Hi,
I am using AJAX code for the first time, I dont have knowledge in java, I just grabbed the code from this forum and trying to manipulate to my requirement.
My Requirement is I have two select lists, 1) host_name and 2) database_name.
As soon as I pick/choose the value in host_name select list, I need to populate only those databases on that particular host. I dont want to submit the page for this action.
Here is the code, I appreciate if some one can help.
On demand Application Process code:
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 "ORA_DATABASES_VW"."DATABASE_NAME" as "DATABASE_NAME",
     "ORA_DATABASES_VW"."DB_ID" as "DB_ID"
from "ORA_DATABASES_VW"
where "ORA_DATABASES_VW"."HOST_NAME" = :TEMP_ITEM)
loop
htp.prn('<option value="' || rec.db_id || '">' || rec.database_name || '</option>');
end loop;
htp.prn('</select>');
end;
HTML Header on that page:
=================
<script language="JavaScript1.1" type="text/javascript">
function get_List_XML (source_item,target_item){
var v_Target = html_GetElement(target_item);
var v_Source = html_GetElement(source_item);
var ajaxResult = new htmldb_Get(null,&APP_ID.,'APPLICATION_PROCESS=POPULATE_LIST_XML',0);
ajaxResult.add('TEMP_ITEM',source_item.value);
var v_result_xml = ajaxResult.get('XML');
if(v_result_xml && v_Target)
var options_Contents = v_result_xml.getElementsByTagName("option");
v_Count = options_Contents.length;
v_Target.length = 0;
for(var i=0;i<v_Count;i++)
var v_opt_xml = v_result_xml.getElementsByTagName("option");
appendToSelect(v_Target, v_opt_xml.getAttribute ('value'),v_opt_xml.firstChild.nodeValue)
function appendToSelect(target_item, option_val, option_content) {
var v_Opt = document.createElement("option");
v_Opt.option_value = option_val;
if(document.all){
target_item.options.add(v_Opt);
v_Opt.innerText = option_content;
}else{
v_Opt.appendChild(document.createTextNode(option_content));
target_item.appendChild(v_Opt);
</script>
Form element attribute in the host_name column. P935_INSTANCE_DB_NAME is my page item for database_name.
onchange="get_List_XML (this,'P935_INSTANCE_DB_NAME')"

Here is the code, Hope I had put it correctly now.
This is fixed now. Thanks a lot for helping out this. I have two questions.
1) I am seeing very slowness when selecting the select list. Will these java code require much resource?
2) I need to put this logic in many screens for many columns. So having these many application process and application items and java code, will the application performance get a hit? I know that application process are on-demand and get called only when required.
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 "ORA_DATABASES_VW"."DATABASE_NAME" as "DATABASE_NAME",
"ORA_DATABASES_VW"."DB_ID" as "DB_ID"
from "ORA_DATABASES_VW"
where "ORA_DATABASES_VW"."HOST_NAME" = :TEMP_ITEM)
loop
htp.prn('<option value="' || rec.db_id || '">' || rec.database_name || '</option>');
end loop;
htp.prn('</select>');
end;
HTML Header on that page:
=================
<script language="JavaScript1.1" type="text/javascript">
function get_List_XML (source_item,target_item){
var v_Target = html_GetElement(target_item);
var v_Source = html_GetElement(source_item);
var ajaxResult = new htmldb_Get(null,&APP_ID.,'APPLICATION_PROCESS=POPULATE_LIST_XML',0);
ajaxResult.add('TEMP_ITEM',source_item.value);
var v_result_xml = ajaxResult.get('XML');
if(v_result_xml && v_Target)
var options_Contents = v_result_xml.getElementsByTagName("option");
v_Count = options_Contents.length;
v_Target.length = 0;
for(var i=0;i<v_Count;i++)
var v_opt_xml = v_result_xml.getElementsByTagName("option");
appendToSelect(v_Target, v_opt_xml.getAttribute ('value'),v_opt_xml.firstChild.nodeValue)
function appendToSelect(target_item, option_val, option_content) {
var v_Opt = document.createElement("option");
v_Opt.option_value = option_val;
if(document.all){
target_item.options.add(v_Opt);
v_Opt.innerText = option_content;
}else{
v_Opt.appendChild(document.createTextNode(option_content));
target_item.appendChild(v_Opt);
</script>
Form element attribute in the host_name column. P935_INSTANCE_DB_NAME is my page item for database_name.
onchange="get_List_XML (this,'P935_INSTANCE_DB_NAME')"
}

Create a select list using AJAX

Hello,
I saw Carl Backstrom and Scott Spendolini examples on how to use AJAX to populate a related item, based on a select list. What I'm looking for is the reversed angle.
I have a TextItem, and I want to generate a select list based on that TextItem, something like this:
select code, desc
from Table
where code like TextItem
Is it possible with AJAX? (in the current examples I gat lost in the on demand application process How, if possible, to render the select list using the HTP package.)
Greatly appreciate the help
Arie.

Carl,
I hope you can help with this, from reading the forum, you seem to have a lot of experience with AJAX and Application Express. I have found your examples within the forums and can not get them to work on my servers. I am on version 2, and a 10g database. I am attempting to place 4 select lists on a page. Each one (with exception from the first) will be dependent on the previous. To make is simple I have started with only 2 select lists. The first select list (p1_select1) is a list of departments. The second list (p1_select2) should populate with the users who belong to the department selected from p1_select1. I can not seem to get the second select list to load. I have attempted to follow your code as best I could, I can see on the page that it has created the xml data, however it just does not populate the second select list. Here is a summary of what I have.
Thanks for lookin.
Mike
Page Regions:
HTML: main (10)
Region Header:
<script language="JavaScript1.1" type="text/javascript">
function f_Get_Data(pThis,pSelect_Source,pSelect_Target){
var l_Return = null;
var l_Select = html_GetElement(pSelect_Target);
var get = new htmldb_Get(null,html_GetElement('pFlowId').value,'APPLICATION_PROCESS=Get_Data',0);
get.add(pSelect_Source,pThis.value);
gReturn = get.get('XML');
if(gReturn && l_Select){
var l_Count = gReturn.getElementsByTagName("option").length;
l_Select.length = 0;
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>
Items
Region: main
10: P1_TEXT1 Select List
20: P1_TEXT2 Select List
P1_TEXT1 Form Element:
onChange="javascript:f_Get_Data(this,'P1_TEXT1','P2_TEXT2')";
APPLICATION PROCESS "On Demand" Get_Data:
declare
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 ENAME , EMPNO
from EMP where DEPTNO = :P1_text1) loop
htp.prn('<option value="' || rec.EMPNO || '">' || rec.ENAME || '</option>');
end loop;
htp.prn('</select>');
exception
when no_data_Found then
null;
end;

Select list that is dependent on another select list with ajax

I have a select list that contains it (ajax)
onchange = "get_select_list_ajax (this, 'P2012_REQUERENTE', 'COMBO_REQUERENTE_ITEM', 'COMBO_REQUERENTE_AJAX');" class = "largura200"
So I have a select list below, which is conditional, according to the value returned from the select list P2012_Cliente.
DECLARE
v_tipo VARCHAR2 (50);
BEGIN
SELECT DISTINCT (id_cliente_tipo) INTO v_tipo FROM vw_cliente
WHERE customer_id =: P2012_CLIENTE;
IF (v_tipo = pkg_cfg.c_tp_cliente_interno) THEN
RETURN true;
ELSE
RETURN false;
END IF;
EXCEPTION WHEN OTHERS THEN
NULL;
END;
But is not working .. Why? He is not detecting the return of the select list that is Ajax?

How can I send the return of a select list (ajax) on a text item?
html_form_attributes of sel. list -> onchange = "get_select_list_ajax (this, 'P2012_REQUERENTE', 'COMBO_REQUERENTE_ITEM', 'COMBO_REQUERENTE_AJAX');" class = "largura200"

AJAX Select list implementation

Similar Messages

Maybe you are looking for