Passing values between Modal Dialog boxes using Javascript

Posted on 2004-11-24
Last Modified: 2012-06-21
Hi all,
I have an HTML page with a link on which calls a Modal Dialog box window. The Modal Dialog box window contains several form fields, however this Modal Dialog window also has a link on which calls another Modal Dialog window which contains a second set of form elements. What I am trying to do is pass data from a field from the second Modal window back into a field on the first Modal window, so that it can in turn be passed back to the HTML page.

So to clarify:
1. HTML Page (page1.html) calls "ModalDialog A".

2. "ModalDialog A" has a textfield within it called "ImageURL", there is also another link which calls "ModalDialog B".

3. "ModalDialog B" has a textfield within it called "txtFileName" and a form button.

When text is entered into "txtFileName" and submitted the value of this textfield needs to be sent back into the textfield "ImageURL" on "ModalDialog A".

Sending values to the HTML page from "ModalDialog A" is fine but I seem to have problems sending values between the two Modal windows - I would have though it was possible though.

Any help would be hugely appreciated.

Many thanks in advance,

Question by:HairJam
    LVL 53

    Expert Comment

    We need to see code.


    Author Comment

    Yep ok. I've tried to just give you the relevant code without all the other stuff.

    The code that calls the first "ModalDialog A" within the HTML page is as follows:

    <input type="button" tabIndex="50" value="Browse" onClick="window.showModalDialog('popups/insert_image.html', '', 'dialogWidth:450px; dialogHeight:315px; center:yes; scroll:no; resizable:no; status:no; help:no;');">


    This opens up "ModalDialog A" (insert_image.html) which has several textfields one of which is:
    <form id="form1" name="form1">
    <INPUT ID="txtFileName2" type=text style="left: 8.54em; top: 6.0647em; width: 21.5em;height: 2.1294em; " tabIndex=10 onfocus="select()" name="ImageURL">

    and the second ModalDialog "ModalDialog B" (popup_imagestore.asp) is called by this button next to the above textfield:

    <BUTTON ID=btnBrowse style="left: 31.36em; top: 7.5000em; width: 7em; height: 2.2em; " type=button tabIndex=50 onClick="window.showModalDialog('../../popup_imagestore.asp', '', 'dialogWidth:450px; dialogHeight:315px; center:yes; scroll:no; resizable:no; status:no; help:no;');">Browse</BUTTON>


    "ModalDialog B" now contains a select box with numerious entries pulled from a database. When the user clicks on an entry I need it to send that value back to "ModalDialog A" and insert it into the textfield called "ImageURL" - this is where I'm stuck.

    <script language=javascript>
    function SetPreviewImage(strUrl)
      opener.document.Form1.ImageURL.value = strUrl;
     // This is returning 'opener.document' is null or not an object

    <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" class="orangeBG">
    <form name="imageContents">
    <select name="FromList" size="12" class="field8"  onClick="SetPreviewImage(this.options[this.selectedIndex].value)">
      Response.Write  strList


    Hope this helps, and hopefully I've not left anything out. If it doesn't make any sense though then let me know.
    LVL 53

    Accepted Solution

    Based on what I see in these two threads you are not going to be able to do it that way.  The first modalDialog cannot retrieve the inforamtion from the second because he is not allowed to be refreshed:

    The the frist one be replaced by a conventional popup using or do you have to have it modal?



    Author Comment

    Ok, I see what you're saying. I can certainly try using a conventional popup for "A" - it might work. I've read the other posts too and they also touch on a similar subject, so thanks for these.

    I'll give the popup window a try first and then come back and let you know how I got on.


    Author Comment

    I tried the conventional '' route but that didn't resolve any of the problems - more honestly it created some elsewhere in the page.

    Still the post you provided has helped me identify that my current route is a non-starter and I'm happy to close the post based on this. I've now looked into combining Modal A and B together and this has allowed me to progress somewhat.

    Many thanks,
    LVL 53

    Expert Comment

    Sorry I didn't have a magic bullet.  Sometimes the browser manufacturers just don't consider what developers relly need to be able to do.  Thanks for the A. :^)


    Featured Post

    Threat Intelligence Starter Resources

    Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

    Join & Write a Comment

    Suggested Solutions

    Title # Comments Views Activity
    Website authentication - 3 58
    Automatic Image Uploading 9 52
    Ready Made PHP Scripts 5 43
    website content maintenance 3 45
    The Client Need Led Us to RSS I recently had an investment company ask me how they might notify their constituents about their newsworthy publications.  Probably you would think "Facebook" or "Twitter" but this is an interesting client.  Their cons…
    Read about why website design really matters in today's demanding market.
    The viewer will learn how to dynamically set the form action using jQuery.
    The viewer will learn how to count occurrences of each item in an array.

    728 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    20 Experts available now in Live!

    Get 1:1 Help Now