Solved

Javascript popup window

Posted on 1998-04-08
26
397 Views
Last Modified: 2011-09-20
When a user clicks on a href, I would like to popup a window with a pull down list and redirect the users selection to another frame on the same page, leaving the original page in its current state.
0
Comment
Question by:isagholi
  • 13
  • 11
  • +1
26 Comments
 
LVL 1

Expert Comment

by:vsinha
ID: 1279148
There are many parts to your question, I can give you hints if you try. Parts of your problem:
1> user clicks on a href, I would like to popup a window
2> want to create a pull down list and redirect the users selection to another frame on the same page, leaving the original page in its current state

let me know what part of this you can't do, and I will help



0
 

Author Comment

by:isagholi
ID: 1279149
I need to invoke a modal popup window that contains a pulldown llist that a user can select from an have the value selected to the calling function.

0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279150
do you want me to do it for you, or hints/suggestions ?
0
 

Author Comment

by:isagholi
ID: 1279151
A sample would be very helpful.

Thanks,
0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279152
I will write a simple example and post it here in a couple of hours (i am slightly busy right now). Or if you want me to e-mail give me your address.

You will need to elaborate on:
"leaving the original page in its current state"
0
 

Author Comment

by:isagholi
ID: 1279153
Assume that there are 2 frames, frame A and B.  The user can click on a link to to an ASP in frame A.  I want this to result in a popup window that contains a pull down menu.  In addition, the contents of frame A should remain as it was before clicking on the link.  

I beleive that this can be done by targeting the frame A href to frame B.  

The major issue for me is, how do I popup a window with a pull down menu and return the users selection to the calling function?

0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279154
oh, i didn't realise you needed to create a modal popup window. (sorry, i know you mentioned it before but I thought you meant otherwise). Does it have to be a modal window (i think it will be more complex)?
0
 

Author Comment

by:isagholi
ID: 1279155
Yes.
0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279156
I have done it using a modal window, but it is not application modal, it is system modal. If you want I can post it.
0
 
LVL 2

Accepted Solution

by:
eelko earned 100 total points
ID: 1279157
Here you see some part of code which will
a) setup a frame set
   <frameset  cols="35%,*">
      <frame name="frameleft" src="frameleft.html" marginwidth="10" marginheight="10"
             scrolling="auto" frameborder="no">
      <frame name="frameright" src="frameright.html" marginwidth="10" marginheight="10"
             scrolling="auto" frameborder="no">
    </frameset>

b) right frame will hold a link which display a popup window on click
<!-- =========== file frameright.html ========= -->
  <HTML>
  <HEAD>
    <TITLE>Untitled</TITLE>
  <script language="JavaScript">
  <!--
  var popupWindow;
  var isOpenPopupWnd = false;
  function askSelection()
  {
      if( !isOpenPopupWnd )
      {
            popupWindow = window.open("popup.html", "popupWnd",
                                                 "width=200,height=200,toolbar=0,location=0" );
            isOpenPopupWnd = true;
      }
  }
  function closePopup()
  {
      if( isOpenPopupWnd )
      {
            popupWindow.close();
            isOpenPopupWnd = false;
      }
  }
  function setLeftFrame( url )
  {
      parent.frameleft.location.href = url;
      closePopup();
  }
  // -->
  </script>
  </HEAD>
  <BODY>
  <a href="javascript:askSelection()">Click for pop-up window</a>
  </BODY>
  </HTML>

c) the popup window will hold a selection and
   onSubmit of the selection the leftframe will be change
<!-- ========= file popup.html ========= -->
  <HTML>
  <HEAD>
    <TITLE>Popup Window</TITLE>
  </HEAD>
  <BODY>
  <form name="form1" onSubmit="
opener.parent.frameleft.window.location.href=document.form1.choice.options[document.form1.choice.selectedIndex].value;
            opener.closePopup(); return false;">
  <select name="choice">
  <option selected value="page1.html">page 1
  <option value="page2.html">page 2
  <option value="page3.html">page 3
  </select>
  <input type="Submit">
  </form>
  </BODY>
  </HTML>

I hope this will answer your question.
0
 

Author Comment

by:isagholi
ID: 1279158
I haven't tried out the solution, however, looking at the code it appears as if it will work.

0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279159
EELKO,
Will the popup be modal. The only ways that I could do that were:
1>  to add the event handler onBlur to call focus in the popup window, or
2> to make each frames onFocus event handler to check 'isOpenPopupWindow' and if yes to set its focus.

problems with these two solutions:
1> the window is not app. modal but system modal (as I mentioned before)
2> doesn't seem to work in all cases

and both of these soln. had the problem that I couldn't return make the same function return the value when the user selected it. (I needed to be able to implement some form of sleep and it would be possible -- ket me know if you can do it)

ISAGHOLI,
I don't see how this soln. makes the popup window modal. It is similar to what I was doing first. I can however provide you with the soln. in either one of the two possibilities I have discussed above.
0
 

Author Comment

by:isagholi
ID: 1279160
VSINHA,

You are correct, the popup is not modal.  I would prefer the second solution that you have prosposed.  However, I'm not clear as to why you are unable to return the user selected value.

0
Top 6 Sources for Identifying Threat Actor TTPs

Understanding your enemy is essential. These six sources will help you identify the most popular threat actor tactics, techniques, and procedures (TTPs).

 
LVL 1

Expert Comment

by:vsinha
ID: 1279161
The problem was that (atleast in NN4) the function would have to finish before the new window actually loaded, so I couldn't make the same function return only when the next window closed. I could however make it call any function on the same page which could extract the value (in other words there is a work-around which will become apparent when I submit my soln.).

I will have need a little time before I post that soln.
0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279162
Here's the soln., it should work perfectly. Let me know if you get any bugs (i spent a couple of hours on it trying to debug):

<====index.html====>
<HTML>
  <HEAD>
    <TITLE>Test Page</TITLE>
  </HEAD>
  <FRAMESET ROWS="10%,*">
    <FRAME SRC="dummy.html">
    <FRAMESET COLS="20%,*">
      <FRAME SRC="main.html">
      <FRAME SRC="dummy.html">
    </FRAMESET>
  </FRAMESET>
</HTML>

<====dummy.html====>
<HTML>
  <BODY>
    Dummy Page
  </BODY>
</HTML>

<====main.html====>
<HTML>
  <HEAD>
  <SCRIPT LANGUAGE="JavaScript">
    <!--
        var mWwnd;
        var mWexists = false;
      for (var i=0; i<parent.frames.length; i++)
        parent.frames[i].onfocus = frmFocused;
        function MenuDone()
        {
            document.forms[0].results.value = mWwnd.document.forms[0].selectmenu.options[mWwnd.document.forms[0].selectmenu.selectedIndex].text;
            mWexists = false;
      }
        function frmFocused(wnd)
        {
          if (mWexists)
              mWwnd.focus();
        }
      function DispMenu()
      {
          mWwnd = window.open("menu.html", "menu", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,copyhistory=no,width=550,height=50");
            mWexists = true;
            mWwnd.CloseMenu = MenuDone;                  //this line doesn't seem to work in IE3 it tell which function to be called when the menu is closed
            for (var i=0; i<parent.frames.length; i++)
              parent.frames[i].onfocus=frmFocused;
        }
    //-->
  </SCRIPT>
  </HEAD>
  <BODY>
    Main Frame
    <p><a href="JavaScript:DispMenu()">menu</a>
      <p>
      <FORM>
        Choice:
        <INPUT TYPE="text" NAME="results" onFocus="blur();">
      </FORM>
  </BODY>
</HTML>

<====menu.html====>
<HTML>
  <HEAD>
  </HEAD>
  <BODY>
    <FORM>
    Please select one item from the menu:
      <SELECT NAME="selectmenu">
        <OPTION SELECTED>item one
        <OPTION>item two
        <OPTION>item three
      </SELECT>
        <INPUT TYPE="button" name="goButton" value="continue" onClick="CloseMenu(); window.close();">
      </FORM>
  </BODY>
</HTML>

<====***====>
Notes:
I have used mW to represent modeless window.



Let me know if you don't undertand something.
0
 

Author Comment

by:isagholi
ID: 1279163
Your last sample works perfectly.  Is there a way to ensure the popup page stays on top of the original page that invoked it?

I plan to use this mechanism on a touch-screen kiosk.  In this environment, if the user looses view of the popup window it is unlikely that they can figure out how to regain view of the popup window; the user will be forced to wait until the page that they are working on times out to start over.


0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279164
Two things:
> I am not getting any points for my previous answer (i don't mind it and it is not going to stop me from answering but it did take close to 6 hours for the entire thing).

> When I tried it it seemed to work perfectly, I would need to know what exactly happened [browser used / what you clicked] so that I can simulate the situation
0
 

Author Comment

by:isagholi
ID: 1279165
In IE4.0, after invoking the popup window, clicking on the main window hides the popup page behind itself, hiding the popup from the user.  This is mostly an issue because our touch-screen kiosk users don't have access to the ALT key to switch between the pages.

Thanks for the many hours that you have spent on this problem.  Is there a way that I can re-assign points to you?

I can certainly understand if you don't have any more time to work on this problem.

Thanks again.


0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279166
IE4.0. ouch, I am actually scared to install it on my machine, after hearing that it iself changes the OS. I will see what I can do. This would mean installing the browser. I have NN4.04 and will try to simulate it there, but I a don't think the problem occured there.

I don't think you can re-assign the points yourself. But you can try posting it as a question (with 0 points) on the Customer Service / Experts Exchange Topic.

I will still try my best to help you, but I have noticed that quality often falls (unconsciously) when there is no motivation ;-)

0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279167
I wanted to confirm, on a touch-screen is the persons touch considered exactly like a mouse click?


With regard to your above statement, you may also want to check this link:
http://www.experts-exchange.com/topics/experts-exchange/Q.10046916
0
 

Author Comment

by:isagholi
ID: 1279168
The dirver can be configured to generate any type of mouse event.  In our case, the touch-screen dirver generats a mouse click event at the coordinates where the user touches the screen.

I'll post a question regarding the re-assignement of points.

Thanks again.
0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279169
There was a mistake in the answer i posted (though it could not cause any interference. Change
function frmFocused(wnd);
to
function frmFocused();



I do not plan to install IE4 unless necessary. So rather than posting a soln. I will post a set of steps for you to follow that should help you find the problem.
try this. make sure DispMenu looks like:
function DispMenu()
{
  ficus();
  mWwnd = window.open("menu.html", "menu", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,copyhistory=no,width=550,height=50");
  mWexists = true;
  mWwnd.CloseMenu = MenuDone;
  parent.onfocus=frmFocused;
   }
let me know if it fixes your problem.
0
 

Author Comment

by:isagholi
ID: 1279170
Thanks.  I'll let you know how it goes.

I have posted a questions regarding re-assignement of points but haven't received a resonse yet.

0
 
LVL 7

Expert Comment

by:linda101698
ID: 1279171
Once a question has been graded and moved to the previously asked questions, it cannot be re-opened.  I will post a question directed to vsinha in this topic area to award him points for all his time and efffort in helping with this question.  Look for it in the new questions and post a short answer vsinha.  Thanks for all the effort!

Linda Gardner
Customer Service @ Experts Exchange
0
 
LVL 1

Expert Comment

by:vsinha
ID: 1279172
isagholi,
Thanks, for ensuring I got the points.

Are all your problems fixed? Let me know.
0
 

Author Comment

by:isagholi
ID: 1279173
Yes, I beleive that we have enough information to complete our project.

Thanks again.
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

757 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

18 Experts available now in Live!

Get 1:1 Help Now