Getting and setting Apex page item values using $v(), $s(), $v2()
The Apex JavaScript API has some very convenient functions to access the values of page items.
For example, if you wante to access the contents of a text field with JavaScript, would would need to reference it something like this:
$x("P2_TEXT_FIELD").value;
If the item you want to reference is a display only item, then the syntax changes:
x = $("#P2_DISPLAY_ONLY").text();
If you need to set the values of these items, the you need to use the varying syntax as well:
$x("P2_TEXT_FIELD").value = "Hello World!";
or
$("#P2_DISPLAY_ONLY").text("Hello World!");
Dealing with these various syntax constructs can be confusing. Fortunately the Apex JavaScript API makes this process much easier. To get page item values simply use $v(“<item_name>”):
x = $v("P2_TEXT_FIELD");
y = $v("P2_DISPLAY_ONLY");
To set the item values use:
$s("P2_TEXT_FIELD","Hello World!");
$s("P2_DISPLAY_ONLY","Hello World!");
See an example on my demo page.
The $v2() is handy if you need to access multiple items in an array. For example multiple selections from check boxes or from a shuttle control can be fetched as an array and handled that way in JavaScript:
myArr = $v2("P2_SHUTTLE_CONTROL");
for (idx=0; idx<myArr.length; idx++) {
//do something with myArr[idx];
}
An example of this functionality can be seen on my demo page, where I also compare $v() and $v2() when used in an array.
Hi Christoph,
to set Items better use $s instead of v$, must be a copy/paste typo 😉
Cheers,
~Dietmar.
Thanks for the correction, Dietmar. It helps to have another pair of eyes check your work. 🙂
And what about the item’s attributes like display only, hidden, etc. What syntax is used in this case to set these attributes?
David,
display only items and hidden items work the same way. You can use the Firebug console to test this out.
Cheers,
Christoph
Hi i am new in Apex and my question is now, when i create just a button with the following script:
javascript:$s(“P2_TEXT_FIELD”,”Hello World!”);
its not work , what do i wrong ?
Arni,
i’m not sure what you’re doing wrong. If you have a button named P2_BUTTON, then you can alter the button text with: $s(“P2_BUTTON”,”hello”). This would change the button text to “hello”.
You can easily test this in the Firebug console in Firefox (if you don’t have the Firebug add-on for Firefox, get it.).
You can simply create a button based on a dynamic action. Use a set value action to set the page item.
Hi Christopher,
Not sure how to do that.
I have been creating a PL/SQL process on the button click and setting the value there. But i dont think thats the nice way of doing it, I want to do it in javascript onclick of the button. I am sure we can do it and I am missing something…just dont know what 🙁
Vidya,
dynamic actions execute javascript and/or pl/sql declaratively, i.e. without having to write code.
Right click your button and select ‘Create Dynamic Action’
Enter a name for the Dynamic Action, e.g. ‘Set Hidden Item Value’. Click Next.
Leave the defaults (Event=click,selection type=button,Button=,condition=no condition). Click Next.
Set the Action to ‘Set Value’. Then a new region shows named ‘Settings’.
Uncheck the ‘Fire on Page Load’ check box.
Select the Set Type to ‘Static’. (you can also choose one of the other types and code accordingly).
Set the value to ‘2’. Click Next.
Set the Selection Type to ‘Item(s)’, then a shuttle control pops up. Choose P22_ADD_VAL and move it to the right side of the shuttle. Click Create Dynamic Action.
Now whenever you click the button, P22_ADD_VAL will be set to ‘2’.
It is done with JavaScript in the background, and no manual coding is necessary.
Thank you christoph. Will test that and keep you updated.
This is great, but how would I use it to retrieve the specific SeriesName from a APEX flash Chart, after the user clicks on it ?
When you click a series in a Flash Chart, you can display the series name in a tooltip. See Tooltip Madness.
hi
thank you
Hey,
Your solution works great for copying data within single pages, but how can i copy the value from a dropbox on page 1 to a textbox on page2?
Unfortunately this only works with items on the current page, since the values are stored in the browser page. If you need to copy values from another page, you would first have to submit them, then read them from the database.
I try to do the following “alert($v(“P1_TODAYS_RESULT”));” in my script but the chrome debugger throws following exception:
Uncaught ReferenceError: $v is not defined
Where do we declare the $v? I am fairly new to APEX.
Thanks.
Satish,
are you getting this error while using the inspector on an APEX page?
Hi Christopher,
I have to to set the value of 2 LOV fields (DB Column) on an APEX page.But When I try to set the value of second one,It refreshes the page.
How can I set the user input values for 2 DB column field which are of type ‘Select List’ as based on these values , all other fields on the page are based upon.
For a select list you actually have to change the option element. Let’s say your select list is P10_MONTHS and you have twelve option elements (one for each month) associated to it. To change the value for the third option (March) you would use $(‘#P10_MONTHS option:nth-child(3)’).val(‘1234’).html(‘hello world’).
Seems I haven’t made my questions clear.Let me clarify my question and put it more precisely by example.
I have a form , say, Employee details Form based on Emp DB table..
On the form,I have first field department as ‘Select List’..When User select a department,say,for ex Dept 10 , Another field ‘Employee Name’ which is of type ‘Select List’ will be displayed with all the employees belonging to department 10.
User go ahead and select a value from EmployeeName LOV , say, for ex. User select employee name ‘John Doe’ , the all the other columns of the employee form will be displayed giving all details of employee ‘John Doe’ like Emp Id , Salary , Address , Contact no etc..
Now,Clarification I seek is as below :
To persist the value of first field ‘Department Id’ , I have set property ‘Page Action on Selection’ as ‘Redirect and Set Value’
Now,EmployeeName LOV is populated with all employee names belonging to department id 10.
No,To persist the value of field ‘Employee Name’ too, I have set property ‘Page Action on Selection’ as ‘Redirect and Set Value’
Now,When User select an employee name , It’ll be set and all the other fields on the form are displayed for that particular employee.
Now,I think In APEX , We can not set the property ‘Page Action on Selection’ of 2 DB Columns as ‘Redirect and Set Value’ as If the value of 1 column is set..While setting the value of 2nd column , 1st column value will get reset.
How can we ‘redirect and set value’ or ‘set value’ of 2 DB columns in APEX without resetting any of them.