Javascript:genList to trigger html input onChange event

I converted a select list to a popup lov because my users liked the quick search of the popup lov. But no I no longer have the onChange event of the select input. Is there a way to customize this genList function, maybe by encapsulating the call into another javascript function to get this on change functionality back?

Well I was able to code around this by re-writing the genList javascript function at runtime in the web client. An alternative I guess would be to use HTMLDB_ITEM and build my items and form within a PL/SQL region.

Similar Messages

Passing collection in JSTL html:select onChange event javascript

I'm trying to pass an object from the form to a javascript function to change text box values when the value of a select field is changed.
On the jsp page, I have access to the collection called rows.
I also have an html:select field that I need to use the onChange event to change other fields on the page. I can certainly call a javascript function on the onChange with no problem. But I need to take it one step further. I need to send the javascript function the collection called rows, so I can set other fields' values on the jsp page to the values of the selected row.
This (or some facimile) is what I want to do:
<html:select name="currentForm" property="value(id)" onChange="fillUomForm(this.form,this,rows);">
<c:forEach var="row" items="${rows}">
      <c:choose>
           <c:when test='${row.id == currentForm.stringValues["id"]}'>
                <option value="<c:out value='${row.id}'/>" selected>
                     <c:out value="${row.id}"/>
                </option>
           </c:when>
           <c:otherwise>
                 <option value="<c:out value='${row.id}'/>">
                    <c:out value="${row.id}"/>
                 </option>
           </c:otherwise>
       </c:choose>
    </c:forEach>
</html:select>Of course, rows is not recognized when I try to run this.
I have tried replacing rows with
<c:out value='${rows}'/> but that did not work.
How can I do this?
thanks,
Walter

sigh.
Another user mixing up JAVA and javaSCRIPT.
Java runs on the server. It generates an HTML page, and stops running.
When the client receives the HTML page it can start running javascript.
The only way java code is run again is if you make another http request. - ie the next time you click a link or submit a form.
Most of the time that results in reloading a new page.
You have two options
1 - Download all the information you might possibly want/need as part of the JSP page. Then the javascript onclick event can retrieve it from javascript memory.
2 - Make the onchange event submit an HTTP request, and then pick up the response, and do with it what it will. AJAX is a technology that lets you update the page without refreshing it completely.
Hope this helps,
evnafets

JavaScript Async Method call on the OnChange event of a lookup

Hello,
I try to fill dynamically a lookup-multi field by selecting a value in a dropdownlist based on a lookup field.
I recreated the onchange event of my dropdowlist by using this code :
lookupElement.onchange = function () { OnFormationChanged() };
When a user select an element in the dropdownlist, "OnFormationChanged" event run an Async method who retrieve elements joined with the selected element in the dropdownlist lookup.
This part works fine, it automatically refresh the multi lookup field but when i save my custom page I got the error :
Value does
not fall within expected range
When I do alert in the OnFormationChanged, it retrieve me for example '0' in the onChange event and '3' in the Asynch event as you can see in this screenshot :
I deduced that the save event method take a wrong result.
For example :
A : If I select in the lookup dropdownlist an element with no attached result in the multi lookup, I will have '0' in the "OnFormationChanged" method and '0' in the "OnQuerySucceeded" method and the multilookup will be empty.
B : If NOW I select in the lookup dropdownlist an element with results in the multi lookup, I will have '0' in the "OnFormationChanged" method and '3' in the OnQuerySucceeded" method and the multilookup will be filled.
But when I save the custom page I will have the error : Value does not fall within expected range as if async result was not recognized by the save button.
Something seems not to be set correctly.Could you give me a way to resolve this issue ?
DkPoo.

To close this post, I finally redefinied the save event and it works nicelly now !

How can I trigger an onchange event for hidden or never displayed item

hi -- I have an item that I don't want displayed on my page -- more info than the user wants or needs; call it B. It needs to be
set by an onchange event from a visible item (A); then, the change of B triggers on onchange to set another item (visible) -- C.
When B is visible on the page, it all works. If I make it hidden or conditionally never displayed, it doesn't work. From the looks of
it, B never gets changed.
How can I trigger this onchange event (from B to set C) with B not visible?
Thanks,
Carol

hi Varad -- Probably more info than you want... but here's the whole chain of events.
Hope it answers your question.
C
**** 1
In A's html form element attributes (simplified; I took out the irrelevant call to jsLookupValue that sets another item).
onchange='jsLookupValue($v("P142_SITE_ID"),"site_id","P142_OBJECTTYPE_ID","objecttype_id","hdb_site_syn");'
**** 2
jsLookupValue is the following.
The statement that actually sets the value of B is: $s(dest_item_name, jsonobj.row[0].RETURN_VAL);
function jsLookupValue(source_item_value, source_column_name, dest_item_name, dest_column_name, lookup_table_name){
// Continue only if there are valid values
if (valueOf(source_column_name)&&valueOf(dest_item_name)&&valueOf(dest_column_name)&&valueOf(lookup_table_name)){
//Check to see if the source_item_value is null (either all spaces or empty
//If it is, set the dest item to null, but only if it's not already --
//otherwise we get into a loop.
source_item_value = trim(source_item_value);
dest_item_value = trim($v(dest_item_name));
if (source_item_value.length==0) {
if (dest_item_value.length != 0) {
$s(dest_item_name, null);
}else{
//This is the AJAX call to the Application Process from step 1
ajaxRequest = new htmldb_Get(null,&APP_ID.,'APPLICATION_PROCESS=LOOKUP_VALUE',0);
//Here we are adding that x01 parameter we use in the app process with the value of the objecttype_name field
ajaxRequest.addParam('x01', source_item_value);
ajaxRequest.addParam('x02', source_column_name);
ajaxRequest.addParam('x03', dest_item_name);
ajaxRequest.addParam('x04', dest_column_name);
ajaxRequest.addParam('x05', lookup_table_name);
//Now do the actual AJAX call and put the result in ajaxResponse
ajaxResponse = ajaxRequest.get();
//Check if there is a response
if (ajaxResponse) {
//We need to format the JSON return string and put it in a JSON object
// the formatting is done by a function in the external JSON library
// the jsonobj can be used to retrieve the data returned by the App process
var jsonobj= ajaxResponse.parseJSON();
// And finally, we set the DNAME item with the value of the jsonobj.DNAME
// an array was created in the object with the name row, so that is why you have to include row[0] to retrieve the data
if (jsonobj.row[0].RETURN_VAL != $v(dest_item_name)) {
$s(dest_item_name, jsonobj.row[0].RETURN_VAL);
}else{
} //not setting
}else{
alert('No response from app process');
} //no response
} //no source item value
} //no bad nulls
} //function
**** 3
I won't bore you with app process LOOKUP_VALUE. It just builds an sql query that gets the value for B, aliased to RETURN_VAL.

Webdynpro abap onChange event for input

Hello,
I wanted to know if "onChange" event for input field is somehow possible in wd abap or if it is planned for next ehp releases
of ECC6.
(Like in Developer studio 7.11)
thanks.

Hi Thomas,
Opening in on a Very old post, but i kind of need an onChange event functionality in one of my Web App. Basically we are dealing with a input field which is populated using a barcode scanner and the user wishes to be able to pull all the information related to the material number read by the scanner in an Input Field Element and display the related info in other fields "Without having to hit ENTER". Sounds a bit lazy but thts wht they need.
I was wondering if its possible to modify the SuggestValue functionality to implement such an event. Any pointers to documents which explain how the SuggestValue works? I am just looking for code blocks (even if they are AJAX/Javascripts) tht i can somehow modify to make this thing work.
P.S. Also if there is any other functionality already introduced by SAP since the last comment on this thread to help solve this will be helpful too
Thanks,
Parth

Dynamically change onchange event of select control of html

Can I dynamically the onchange event of select control of html?
i..e. change the task to be done when the onchange event is triggered.
Thanks in advance

Yes.
At what point do you want to change it?
What do you want to change it to?
If you are generating the page, you can obviously produce different code behind the button using JSP to generate javascript code.
eg
function alertUser(){
alert('<%= alertMessage %>');
}That will produce a different function every time you load the page, depending on the variable "alertMessage".
You can also replace javascript handlers at runtime, just by simply assigning functions. However you at the client end you are only able to run javascript - no java.
eg
function alertUser1(){
alert("action a");
function alertUser2(){
alert("action b");
<button id="button1" onclick="alertUser1()">Alert!</button>
<button onclick="button1.onclick=alertUser2">Alert!</button>Does that help?

Have an onchange event in SPD to update a list based on user selection of data view drop down?

Hoping someone can point me in the right direction: I have a list for Media announcements, each one of these announcements will have various types of documents associated (via look up field in the doc library). I am trying to have a data form web part (dropdown)
as the selector (as I am not liking the SharePoint list filter feature) to have a user be able to select the Media Title, then it refreshes the three web parts on the page (1 for the announcement, then one for type1 docs and one for type 2 docs.)
What is the best way to create an onchange event to have the selected option be connected to the first web part (media title on a list view) so that the information on the page can all be filtered?

Hi,
Would you mind providing more details about your requirement? Are there one Announcements list and two Document Library in a page?
Suppose you have one Announcements list and two Document Library in a page, then you want to add a Drop Down Menu(not the OOTB SharePoint List Filter Web Part) to filter the
three List View Web Part dynamically.
There will be two workarounds:
1. Use the OOTB “Connections” feature of the list to “Get Filter Values From” one of the three lists, then there will be a “Select” button in that list, we can click it to filter
other two lists/libraries. This is a way without code though we may not have the Drop Down Menu;
2. Add three <iframe> in a page, then add a Drop Down Menu in this page. Now, we will need some JavaScript to listen to the onchange event of this Drop Down Menu. We can
get the values populated in the Drop Down Menu from one of the column of one of the list, when making a selection in it, we can pass an URL with query strings to the three iframes which will show the three different lists or libraries.
The second way requires some code to interact with Client Object Model cause we need to get values from a list, some script to handle the onchange event, which seems more suit
with your need.
Here are some links might be helpful if you want to take the second way:
About how to find a specific element on a page using JavaScript:
http://javascript.info/tutorial/searching-elements-dom
Handle the onchange event using jQuery.change function:
http://api.jquery.com/change/
About query string to filter a list view:
http://techtrainingnotes.blogspot.com/2012/03/sharepoint-search-filter-or-sort-lists.html
About change the src attribute of iframe:
http://stackoverflow.com/questions/3730159/changing-iframe-src-with-javascript
http://www.w3schools.com/jsref/prop_frame_src.asp
Best regards
Patrick Liang
TechNet Community Support

Use of javascript and textarea with HTML editor

Hi all,
I have been trying to use some onchange javascript in the HTML Form Element Attributes of an item which is a textarea with an HTML Editor. It just seems to ignore the code. When you "view source" the code does not seem to be there.
What I am attempting to do is described in thread: detecting changes to items prior to submitting page
i.e. to warn a user that if they leave the page without saving they will lose their changes. It works fine with most of the other items on the page i.e. text boxes, select lists but not the textarea with html editor.
Is there somewhere else I should be putting my js for items of this type? I have spent some time looking through the forum posts but cannot find an answer so far.
Thanks,
Brian

I'm having the same problem.
Would like to use the onChange event in a textarea with html editor.
This works in Firefox (where I don't get the html editor but only a textarea) but doesn't seem to work in IE.
Is there another way of detecting the user has changed the text in the html editor?
Thanks,
Pieter

Select list - Onchange event

I want to add an onchange event in a form for a Select list.
For that i had written two javascript functions and two application process.
In HTML Form Element Attributes of the Select List, I had written the following :
style="font-family:Franklin Gothic Medium;font-size:12px;width:160px";onchange="f_bomqty()";onchange="f_rmc();"
But, when change the Select List item, the onchange event happens for obly the first function ie. onchange="f_bomqty()";
Please suggest, whether anything is wrong in In HTML Form Element Attributes ?
Can we populate two Textfields at the same time, for an Onchange event of a select list ?
Yogesh

No change. Please check if anything is wrong in javascripts and application process.
The javascript code and application process are as follows :
Javascripts
<script language="JavaScript" type="text/javascript">
htmldb_delete_message='"DELETE_CONFIRM_MSG"';
function f_bomqty()
var lVal = $v('P10_CR_BOM_CODE');
var get = new htmldb_Get(null,&APP_ID.,'APPLICATION_PROCESS=BOMQTY',0);
get.add('P10_CR_BOM_CODE',lVal);
var gReturn = get.get();
if(gReturn){
$x_Value('P10_CR_QUANTITY', gReturn);
} else {
$x_Value('P10_CR_QUANTITY', '');
get = null;
function f_rmc()
var lVal = $v('P10_CR_BOM_CODE');
var get = new htmldb_Get(null,&APP_ID.,'APPLICATION_PROCESS=RMC',0);
get.add('P10_CR_BOM_CODE',lVal);
var gReturn = get.get();
if(gReturn){
$x_Value('P10_CR_RMC', gReturn);
} else {
$x_Value('P10_CR_RMC', '');
get = null;
</script>
Application process : - BOMQTY
DECLARE
BQTY NUMBER;
ERROR VARCHAR2(200);
BEGIN
SELECT CR_QUANTITY INTO BQTY
FROM CM_RECIPE
WHERE CR_BOM_CODE = :P10_CR_BOM_CODE;
HTP.prn (BQTY);
EXCEPTION
WHEN OTHERS
THEN HTP.prn (sqlerrm);
END;
Application process : - RMC
DECLARE
RMC NUMBER;
ERROR VARCHAR2(200);
BEGIN
SELECT RMCCOST
INTO RMC
FROM
SELECT SUM(CRI_QTY * CRI_RM_COST) / CR_QUANTITY RMCCOST
FROM CM_RECIPE, CM_RECIPE_ITEM
WHERE CR_BOM_CODE = :P10_CR_BOM_CODE
AND CR_ID = :P10_CR_ID
GROUP BY CR_QUANTITY
HTP.prn (RMC);
EXCEPTION
WHEN OTHERS THEN
ERROR := 'Error - Cannot calculate the RMC';
HTP.prn (ERROR);
END;
Yogesh

Unable to update chart after onchange event

I have an OnChange event from my irpt containing a drop down box and an iSPCChart. I would like to have it when the user selects a number from the drop down list it passes the param and then refreshes the chart.   I know everything works on this except my update grid code because I click the refresh on the chart footer and the chart reflects what the user selects. Can you please review this and let me know what I need to do to fix this?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>

        <title>SK_FinalWeights_Ind</title>
        <meta http-equiv="Content-Type" content="text/html; charset=us-ascii" />
        <meta http-equiv="Expires" content="0" />
        <meta http-equiv="Cache-Control" content="no-cache" />
        <meta http-equiv="Pragma" content="no-cache" />
          <script type="text/javascript">
where          tblSelection.Select List
applet          ind_SK_FinalWeights
type          onChange
class          n/a
method          onChange
Comments     Ignores "-- Select --" and selects the value from the dropdown list.
               Then sets the param.5 (Fix Query: Select TOP [Param.5] ...From ...Where).
               Updates the grid to reflect value selected.
Examples     (1) alert(eval(obj<i>.value))
               (2) alert(df.RecordCount.value)
                function doSel(obj)
                          var df = document.frmMain;
                          for (i = 1; i < obj.length; i++)
                                    if (obj<i>.selected == true)
                                              document.ind_SK_FinalWeights.getQueryObject().setParam(5,df.RecordCount.value);
                                              document.ind_SK_FinalWeights.updateGrid(true);
//------------------------> Problem is on above line <-----------------------------------
          </script>
    </head>
    <body>

          <form name="frmMain">
               <table name="tblMain" border="5">
                    <tr>
                         <table name="tblSelection" border="0">
                         <td>Record Count</td>
                              <td>
                                   <select name="RecordCount" onchange="doSel(this)">
                                        <option> -- Select --</option>
                                        <option value="10">10</option>
                                        <option value="25">25</option>
                                        <option value="50" selected="selected">50</option>
                                        <option value="75">75</option>
                                        <option value="100">100</option>
                                        <option value="150">150</option>
                                        <option value="250">250</option>
                                        <option value="500">500</option>
                                   </select>
                              </td>
                         </table>
                    </tr>
                    <tr>
                         <td>
                              <applet name="ind_SK_FinalWeights" codebase="/Illuminator/Classes" code="iSPCChart" archive="illum8.zip" width="775" height="480" mayscript>
                              <param name="DisplayTemplate" value="LincolnElectric/Dev/SK/dspSK_FinalWeights_Ind">
                              <param name="QueryTemplate" value="LincolnElectric/Dev/SK/qrySK_FinalWeights_IndChart">
                              <param name="ShowVerticalGrid" value="false">
                              <param name="InitialUpdate" value="true">
                              <param name="Param.1" value="{ID}">
                              <param name="Param.2" value="{Line}">
                              <param name="Param.3" value="{Operator}">
                              <param name="Param.4" value="{OrderNo}">
                              <param name="Param.5" value="50">
                              </applet>
                         </td>
                    </tr>
               </table>
          </form>
    </body>
</html>

You have an iSPCChart applet, but are using the iGrid's updateGrid(true) method. Try changing the updateGrid(true) to updateChart(true). That should work for you.

OnChange() event how does it work and what is the syntax

hi,
i have a field (County) on a form in a jsp page that needs to get all its values from the database and present it to the user also i have another field (year) this also needs to get all its values as a drop down from the database.
i dont have any lib tag available to use and can't afford the time to set this up. so just have to script in jsp or use beans in jsp.
my question is 2fold
Q1. - i was thinking of having a DataAccess (dA) object to run a sql to select * distict couties ...
also have another query in DataAccess select * Distinct year....
and in the jsp instantiate the (dA) and iterate through and fill the select drop down box - how to code this syntax i'm not sure and if this is the correct approach or the only approach would appreciate some sample code that i can mess around with thanks.
- is above approach best way of doing this. - also taking into account Q2.
Q2 - when the user selects county then i need to fire a onChange event - probably using javascript but not sure how this works - bascially i need to then update the year drop down according to the below sql-
again how is this possible - and is this the best approach or will it be too many calls to the database - especially consdering that the forms are all part of a search tool.
SELECT     DISTINCT     v.year
FROM          v_volumes     v
WHERE          v.county     = <the selected county>
OR          (v.county_reference     =
               (SELECT     ca.county_reference
                FROM          county_aliases     ca
                ,          counties     c
                WHERE     ca.county_reference_also_called     = c.county_reference
                AND          c.county     = <the selected county>)
ORDER BY v.year

Sorry to rain on your parade, but its not going to be quite that simple.
Populating a second dropdown depending on the first one, has been discussed quite in depth on this forum, I suggest you do a search to look at older posts.
Javascript code cannot call java/database code from an onclick event.
The best it can do is trigger a form submission, which reloads the page
running any java/sql code that displaying the page entails.
So onlick event on the first dropdown triggers a form submit, which loads the page with the correct values in the second dropdown.
con: requires a page request
The other approach is to download ALL possible values to the jsp page, and have javascript handle the swapping of values.
pro: no page refresh needed
con: must have all data available on the page. javascript is a bit more complicated.
Hope this helps,
evnafets

How to pass tabular report col reference in the onChange event of Txtfield

Hi there
I need to have Onchange event on Textfield Item.
Whenever i change the text field value, the new value should go to particular column in my
tabular report.
So in the onchange event, i have to pass the tabular report column (target field) along with textfield value (this.value)
something like this:
onChange="javascript:changeColVal(this,rowid);"
I have no clue how to pass row id / particular column of tabular report in textfield.
Any pointers on this would be of great help.
Thanks
Vijay

Hi Andy
Thanks a ton for your reply.
The above solution would work fine when we refer Text field within that tabular report.
but if we refer text field Item from separate HTML region?
I'm sorry, its my mistake for not providing OTN application for reference.
I've come up with dummy application which shows you exact requirement.
Please follow url: http://apex.oracle.com/pls/otn/f?p=47869:21
login credentials:
workspace: vsanthanam
user: vijay
pswd: apex_demo
Application highlights the row whenever we move up/down or click the row.
Here, i've NOTES in tabular report and Comments "text field" in separate HTML region.
Whenever i type/update comments in textfeild, it should goto Notes column in Tabular report.
so that when we move up/down the tabular report rows, it should show corresponding Notes in Comments text field.
Approach i've took:
1) Created a function hiliterow, that highlights the row clicked/move up or down and
also displays the Notes Column of Tabular report into Comments Textfield.
(this is to display Notes if already avail to that particular row, otherwise Null)
2) Function passValues would assign the value we type in Comments Text field to
Notes column of Tabular Report. (as of now, this is happening only when we click on that particular row after key-in the value in Comments txtfield,
but this should happen when onChange event on comment textfield)
3) In MoveupDown function, i'm refering the current row in var r. so i tought to have global var to hold current row, so that i can
refer the same row in Onchange Event of Textfield. But this fails (please refer NotesToRow function)
My requirement is to pass the Comments text field value to Tabular report when onChange event on Comments Text feild happens.
I'm helpless in passing row reference to onChange function.
Any pointer on this would be of immense help.
Thanks
vijay

Assigning html input value to a jsp variable

I have the following problem: I need to assign the value of html <input> field to a jsp variable. This should be done without submittion of the form.
<form name="main">
<table>
<tr>
<td><input type="text" name="gantry" value="123"></td>
</tr>
<table>
</form>
Is there any way to access main.gantry.value from jsp and assign it to a variable? I tried
<% prevGantry = main.gantry.value; %>
but it didn't work, and the problem is not with parsong or initialisation. Please, can anyone help?
Best regards, SoVa.

No it can't be done. You are mixing up java with javascript.
Java/JSP runs on the server end. Generates an HTML page and stops running.
The page loads in the browser, and and can run javascript locally.
The only way to run java code again is to go through the request/response process. ie submit a form, click a link, make an Ajax call...
The only way to get a field from the screen into a java variable is via request.getParameter().

Apex 3.2, How to use an onchange event with Popup Key LOV - it ignores me.

Hoping there is a simple solution to this.
Using Apex 3.2 with a simple form with a few fields. When the user selects a value from a Popup Key LOV, I want to fire a javascript onchange event and alter another field on the form.
Seems simple enough, except that I can't figure out how to make the PopUp respond to onchange events. The default template seems to ignore javascript entered into the attribute fields that work in other form fields. I know this is simple do to for a select list - it works as expected there. A select list is not a good option because of the huge number of possible returned values.
Even tried a different approach...to register the onchange event using the "addLoadEvent" with this code (this also does not work):
function setThisUp() {
var x = document.getElementById('P105_CTR_ID');
x.onClick = popupLovChanged;
function popupLovChanged() {
alert('OMG IT WORKS!');
addLoadEvent(setThisUp);
If any of you have some advice on how to make onchange work, it would be greatly appreciated.
Thanks in advance
-Rich

For those still looking for a solution.
I found that you can overwrite the default javascript function passback(x) in the popup lov's template, just add your function in the After Field Text field of the template
e.g.
<script> function passBack(x) {
opener.document.getElementById('P2_PROGRAMME').value = x;
opener.document.getElementById('P2_PROGRAMME').focus();
close();
} </script>
this is going to populate the 'P2_PROGRAMME' field with selected value, and focus on it.
in your case, just add the codes you want to run into the passback function.
hope this helps

Tabular form with Popuv LOV doesn't work with onchange event

Hi all.
I have a problem with tabular forms, Popuv LOVs and javascript.
I have created one tabular form, I want to put a value in "my_field" field when a user selects a new value from other field called "my_list", I have this code:
<script type="text/javascript">
function putValue(pThis)
var vRow = pThis.id.substr(pThis.id.indexOf('_')+1);
html_GetElement('f06_'+vRow).value = '0000';
</script>and this for Element Attributes:
onchange="putValue(this);"Everything works well when I choose "Display as Text Field", but if I change this option to "Display as Popup KEY LOV" or "Popup LOV" it doesn't work, I mean "my_field" stays without any value.
I'm using Oracle Application Express Release 4.0 and Oracle 11g
Please help.
Regards.

Hi Peter.
Thanks, yes, in fact the position of my column changes, but it doesn't work even with the correct element, I have made a lot of proves and it seems that APEX constructs POPUPS LOVS in a different way and that's why "onchange" does not work.
With this thread: Re: onchange not work on popup lov for a field on collection I have a half solution, It works for existing rows, but it doesn't for added rows.
I have solved this problem calling a function that set the onchange event to every row when "ADD ROW" button is pressed, now it works without problems.
Regards.
Oscar.

Javascript:genList to trigger html input onChange event

Similar Messages

Maybe you are looking for