Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    Regular Coder
    Join Date
    May 2011
    Location
    new york
    Posts
    118
    Thanks
    4
    Thanked 0 Times in 0 Posts

    a form action that redirects + popup

    Hi, I'm trying to make a form that when you click "submit", the original page goes somewhere, and it also creates a popup for the action URL.

    Currently, I can get the popup portion, but the can't get the original window to redirect somewhere else.

    this is what I have in the head.

    Code:
    <SCRIPT TYPE="text/javascript">
    <!--
    function popupform(myform, windowname)
    {
    if (! window.focus) return true;
    window.open('', windowname, 'height=200,width=400,scrollbars=no');
    myform.target=windowname;
    return true;
    }
    //-->
    </SCRIPT>
    And this is what I have in the body

    Code:
    <form id="update" action="update.php" method="POST" name="update" onSubmit="popupform(this, 'join')">

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,947
    Thanks
    79
    Thanked 4,424 Times in 4,389 Posts
    ??? what is target supposed to be?

    Code:
    myform.rel="nofollow" 
    target=windowname;
    And since when do <form>s have rel properties?

    And your popup will be an empty window.

    I'm lost.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Regular Coder
    Join Date
    May 2011
    Location
    new york
    Posts
    118
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Old Pedant View Post
    ??? what is target supposed to be?

    Code:
    myform.rel="nofollow" 
    target=windowname;
    And since when do <form>s have rel properties?

    And your popup will be an empty window.

    I'm lost.

    The popup opens up action (update.php in this instance). Not sure what goes in the target, it doesnt seem to affect the functionality. I'm using the code from a tutorial.

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,947
    Thanks
    79
    Thanked 4,424 Times in 4,389 Posts
    ??? I don't see where the popup opens update.php

    If it does, you aren't showing us something.

    Where do you want the original window to redirect to?

    And do you *EVER* want update.php to open in the main window? Or should it always open in the popup?
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #5
    Regular Coder
    Join Date
    May 2011
    Location
    new york
    Posts
    118
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Old Pedant View Post
    ??? I don't see where the popup opens update.php

    If it does, you aren't showing us something.

    Where do you want the original window to redirect to?

    And do you *EVER* want update.php to open in the main window? Or should it always open in the popup?


    Here is the entire code

    Code:
    <html><head>
    <SCRIPT TYPE="text/javascript">
    <!--
    function popupform(myform, windowname)
    {
    if (! window.focus) return true;
    window.open('', windowname, 'height=200,width=400,scrollbars=no');
    myform.target=windowname;
    return true;
    }
    //-->
    </SCRIPT>
    	</head>
    
    		<form id="update" action="update.php" method="POST" name="update" onSubmit="popupform(this, 'join')">
    	<label for="username">user name:</label>
    															<input id="username" name="username" style="width: 100%;" size="25" maxlength="256" type="text"></td>
    											<label for="password">Password:</label>
    		<input autocomplete="off" style="width: 100%;" id="password" name="password" size="25" maxlength="256" onfocus="g_fDoFocus=false;" type="password"><div style="margin-bottom:-0px;"><input value="Update" id="update" name="update" type="submit"></div>
    															
    	
    	</form>
    	
    
    
    </body></html>

    The original should be redirected to any page of my choosing after 5 seconds. Keep in mind the popup also has a timer that closes after 5 seconds. update.php will always be in the popup, which will close by itself after 5 seconds.

  • #6
    Regular Coder
    Join Date
    May 2011
    Location
    new york
    Posts
    118
    Thanks
    4
    Thanked 0 Times in 0 Posts
    in the update php

    i have this in the body to get the popup to close by itself

    Code:
    <body onload="javascript:setTimeout('self.close();',5000);">

    Anybody have any ideas?

  • #7
    Regular Coder
    Join Date
    May 2011
    Location
    new york
    Posts
    118
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Code:
    1 <SCRIPT TYPE="text/javascript">
    2 <!--
    3 function popupform(myform, windowname)
    4 {
    5 if (! window.focus)return true;
    6 window.open('', windowname, 'height=200,width=400,scrollbars=yes');
    7 myform.target=windowname;
    8 return true;
    9 }
    10 //-->
    11 </SCRIPT>


    Line 1 begins the script element and line 2 begins the comment that should surround every script.

    Line 3 begins the popupform() function. popupform() takes two arguments. The first argument, myform, refers to the form itself. The second argument, windowname, sets a unique name for the popup window.

    Line 4 has the opening bracket for the popupform() function. Line 5 tests for the window.focus method which is required to bring the popup to the front every time.

    Line 6 opens the popup. Notice that we don't give the popup a URL. When the popup opens it's blank. Line 7 sets the target property of the form to the name of the popup, so when the form opens it targets the popup instead of the current page.

    8 returns true. Technically this line isn't needed because in the onSubmit attribute we don't use return. However, it's easy to forget and put a return statement in... 8 makes the script a little more fault tolerant.

    Line 9 closes the function, 10 closes the comment, and 11 closes the script.



    So it's working right now, but its just missing the timed redirection of the original page.

    Remember, update.php has a self.close() in the body tag. So it closes itself out after 5 seconds.

    I want the original window to redirect itself 5 seconds after the user hits "submit", so it looks like it redirects right after the popup closes. I believe that I have to add another script but I'm not sure how to do this.

    It should be something like, target.originalframe = redirect, 5000); but I'm not sure of the syntax, or even if its proper form?

  • #8
    Regular Coder
    Join Date
    May 2011
    Location
    new york
    Posts
    118
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Code:
    <form id="update" action="update.php" method="POST" name="update" onSubmit="popupform(this, 'join') javascript:setTimeout("onclick="window.location='http://example.com/';",5000);   ">
    I'm trying variations of the above but it does not seem to be working. The popup occurs, but no redirection occurs with the original window.

    However, with the below code, I can get the original window to redirect, but it happens immediately after the click, I'm trying to get it to redirect only after a specified amount of time.
    Code:
    <form id="update" action="update.php" method="POST" name="update" onSubmit="popupform(this, 'join') onclick="window.location='http://example.com/';">

  • #9
    Regular Coder
    Join Date
    May 2011
    Location
    new york
    Posts
    118
    Thanks
    4
    Thanked 0 Times in 0 Posts
    I figured it out.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •