Skip to main content

Returning a Value from a Popup Page

I just ran into a situation where I needed to pass back a value from a pop-up page to a tabular form item in the calling page. While I've done this in the past ny manually writing all of the JavaScript, I thought that I'd take a look at the new documented APEX JavaScript APIs.

I came across this function in the APEX 3.2 API Reference Guide (Part #E13369-01):

$v_PopupReturn(pValue, pThat)
Sets the value of the item in the parent window (pThat), with (pValue) and then
closes the popup window.
Return Value
Not applicable.
Parameters
pValue (string)
pThat (DOM node | string ID)

Looks perfect!  In addition to passing the value back, it will also close the pop-up page, even though that is not documented.

On the pop-up page, I created a link with an Optional Redirect to URL, and put the following in the link:

javascript:$v_PopupReturn(#EMPNO#, '&P3_NODE.')

P3_NODE is the DOM ID of the tabular form item that I wanted to return the value to.  You'll need to make sure that it's formatted properly for this to work.  Thus, I am passing in a "1", but returning "f03_0001".  A simple computation can do the trick.

Since we're using a built-in tabular form, we need to put the calling JavaScript in the Element Attributes of the item that we want the popup form to set.  I used this:

onclick="popUp2('f?p=' + $v('pFlowId') + ':3:' 
+ $v('pInstance') + '::::P3_NODE:#ROWNUM#',250,600);" readonly

This will pop open a new window, based on page 3 of my application.  It will also grab the Application ID and Session ID from the DOM and use those in the link, so that we preserve our session state.  Finally, it will pass along the corresponding ROWNUM of the item that we clicked on to the item P3_NODE - where I will make the proper transformation with the computation on Page 3.  Lastly, the readonly option prevents users from making direct changes to the item.

Point taken from this - have a look at the APEX API guide before you embark on writing your own code.  There are a number of helpful functions there than can save a lot of time and hassle.

Comments

Taj said…
Nice. Just 2 weeks back I was looking for this kind of functionality. Didn't realize it is available in 3.2 version. I had to write my code (we are on 3.1.2).

Guess, one more reason to update to the newest version.

Thanks -Scott- for sharing.

-Taj
Morten Braten said…
Docs:

"$v_PopupReturn(pValue, pThat)
Sets the value of the item in the parent window (pThat), with (pValue) and then
closes the popup window."

You wrote:

"it will also close the pop-up page, even though that is not documented."

Assuming the first is a copy-paste from the documentation, I think your statement needs revision :-)
Scott said…
Nah, I just need to drink more coffee before posting blog entries. :)

Thanks for the correction.

- Scott -
Sujay said…
You can also use JQuery modal dialogs to achieve the same result. It will probably look nicer :)

http://jqueryui.com/demos/dialog/

Sujay
Scott said…
Sure, you can use jQuery, but the solution that I outlined does not rely on any additional components, making it a lot more portable and simple. Sure, it may not look as good, but it took less than 10 minutes to implement from start to finish.

Thanks,

- Scott -
Anonymous said…
Nice Post.
Do you have any applications where I can see how this has been implemented?
I am using APEX 4.0.Can we use the same in 4.0 too?
Scott said…
Sorry, I don't have a working example. It should still work in 4.0, but there may be a better way to do it.

- Scott -
AI said…
Hi Scott, If you were to return value back to parent page where parent page item was a pop-up LOV, how would it work?

In my case its just blank. The page closes so I know it works.

Chhers.
Hi, Thanks for this post :) It was so useful, I'm working on apex 4.2 and as you said in a comment, "there may be a better way to do it" But this one is working excellent, and combined with Dynamic actions, I can create a Popup report ¿? :P something like a Popup LOV but showing a report instead of a list of links, it looks so much better and takes not much time.

Popular posts from this blog

Custom Export to CSV

It's been a while since I've updated my blog. I've been quite busy lately, and just have not had the time that I used to. We're expecting our 1st child in just a few short weeks now, so most of my free time has been spent learning Lamaze breathing, making the weekly run to Babies R Us, and relocating my office from the larger room upstairs to the smaller one downstairs - which I do happen to like MUCH more than I had anticipated. I have everything I need within a short walk - a bathroom, beer fridge, and 52" HD TV. I only need to go upstairs to eat and sleep now, but alas, this will all change soon... Recently, I was asked if you could change the way Export to CSV in ApEx works. The short answer is, of course, no. But it's not too difficult to "roll your own" CSV export procedure. Why would you want to do this? Well, the customer's requirement was to manipulate some data when the Export link was clicked, and then export it to CSV in a forma...

Manipulating Images with the... Database?

A recent thread on the OTN HTML DB Forum asked about how to determine the width & height of an image stored as a BLOB in an Oracle table. I mentioned in that thread that I have some code to manipulate an image stored in a BLOB column. This is particularly useful if you’re going to let users upload images, and you want to re-size them to display as a thumbnail. Thanks to Oracle interMedia , it is trivial to manipulate the width, height, and other attributes of images stored in an Oracle table. I’ve created a sample application here which demonstrates Oracle interMedia and HTML DB in action. Feel free to have a look. You can download this application from HTML DB Studio as well. Basically, this application allows you to upload images and perform an operation on the image as it is inserted into the PHOTO_CATALOG table. There are two places where some PL/SQL code is required: an After Submit process on page 2, and a procedure to display the images. Here is the PL/SQL for the After...

Refreshing PL/SQL Regions in APEX

If you've been using APEX long enough, you've probably used a PL/SQL Region to render some sort of HTML that the APEX built-in components simply can't handle. Perhaps a complex chart or region that has a lot of custom content and/or layout. While best practices may be to use an APEX component, or if not, build a plugin, we all know that sometimes reality doesn't give us that kind of time or flexibility. While the PL/SQL Region is quite powerful, it still lacks a key feature: the ability to be refreshed by a Dynamic Action. This is true even in APEX 5. Fortunately, there's a simple workaround that only requires a small change to your code: change your procedure to a function and call it from a Classic Report region. In changing your procedure to a function, you'll likely only need to make one type of change: converting and htp.prn calls to instead populate and return a variable at the end of the function. Most, if not all of the rest of the code can rem...