Cannot close popup window after submit

Discussion in 'Javascript' started by Gabriella, Jan 22, 2007.

  1. Gabriella

    Gabriella Guest

    Hi,

    I have a popup window that opens from a page on my website.
    This popup is a form with several fields.
    Upon submit button it redirects to a server side ASP page which writes
    all data to the DB.

    I would like the popup to close immediately after the submit button is
    clicked, and data is saved, (or cancel button) - but this does not
    happen.
    The popup window remains open, even though I have a "return false;"
    after window.open in the onclick event.

    What am I missing?

    <a href="myurl.asp" onclick="window.open('myurl.asp',
    'title','toolbar=no,width=700,height=600'); return false;">post a
    note</a>;

    Thanks, Gabi.
     
    Gabriella, Jan 22, 2007
    #1
    1. Advertising

  2. Hi,

    Gabriella wrote:
    > Hi,
    >
    > I have a popup window that opens from a page on my website.
    > This popup is a form with several fields.
    > Upon submit button it redirects to a server side ASP page which writes
    > all data to the DB.
    >
    > I would like the popup to close immediately after the submit button is
    > clicked, and data is saved, (or cancel button) - but this does not
    > happen.
    > The popup window remains open, even though I have a "return false;"
    > after window.open in the onclick event.
    >
    > What am I missing?
    >
    > <a href="myurl.asp" onclick="window.open('myurl.asp',
    > 'title','toolbar=no,width=700,height=600'); return false;">post a
    > note</a>;
    >
    > Thanks, Gabi.


    You misunderstood what "return false" does here. It only tells the
    browser, that the "href" part of the link must not be executed after the
    "onclick" event has been executed. If you don't return false, then the
    browser will open the window, and then (when the script is finished), it
    will navigate to the URL written in the HREF part.

    If you want to close the pop-up after submitting the link, you can use
    this code:

    <input type="button" value="submit"
    onclick="this.form.submit();top.close();" />

    Alternatively, you can also use the onsubmit event of the form.

    <form action="..."
    onsubmit="top.close();">

    ....

    </form>

    Note also that pop-ups are rather not recommended, and you may consider
    an inline floating DIV instead.

    Greetings,
    Laurent
    --
    Laurent Bugnion [MVP ASP.NET]
    Software engineering: http://www.galasoft-LB.ch
    PhotoAlbum: http://www.galasoft-LB.ch/pictures
    Support children in Calcutta: http://www.calcutta-espoir.ch
     
    Laurent Bugnion [MVP], Jan 22, 2007
    #2
    1. Advertising

  3. Gabriella

    Gabriella Guest

    Thanks a lot!!

    Another question:
    I want to refresh the opener page immediately after closing the popup.
    How do I do that?

    Why are popups not recommended?
    Can you show me how to use an inline floading DIV instead?

    Thanks again, Gabi.
     
    Gabriella, Jan 22, 2007
    #3
  4. Hi,

    Gabriella wrote:
    > Thanks a lot!!
    >
    > Another question:
    > I want to refresh the opener page immediately after closing the popup.
    > How do I do that?


    If you keep the popup, before you close the pop-up with self.close(),
    you can call

    opener.location.reload();

    "opener" is a keyword with a reference to the opener window. The Window
    object has a location property, which is an instance of the Location
    object, which you can reload.


    > Why are popups not recommended?


    For many reasons, mostly explained here:
    http://developer.mozilla.org/en/docs/DOM:window.open#Avoid_resorting_to_window.open.28.29

    In short: You can never be sure that a popup will actually be displayed
    (because of popup blockers), and it annoys users.

    For the record, I still have a few apps using popups, but I am slowly
    removing them when I work on these apps.

    > Can you show me how to use an inline floading DIV instead?


    You can use this kind of HTML/CSS code to position a DIV absolutely:

    <div style="position: absolute;
    top: 100px;
    left: 200px;">

    ....

    </div>

    Additionally, you can play with the "display" property in the style to
    show and hide the DIV, for example:

    <div id="divForm"
    style="position: absolute;
    top: 100px;
    left: 200px;
    display: none;">

    ....

    </div>

    and then:

    var nDiv = document.getElementById( "divForm" );
    if ( nDiv
    && nDiv.style
    && nDiv.style.display )
    {
    nDiv.style.display = "block";
    }

    Note that since the DIV is inline (not a separate window), when you
    submit the form, the whole page will be refreshed, which is what you
    wanted from the start.

    If you want to avoid refreshing the page, then you must resort to AJAX
    to post your data to the server.


    > Thanks again, Gabi.


    HTH,
    Laurent
    --
    Laurent Bugnion [MVP ASP.NET]
    Software engineering: http://www.galasoft-LB.ch
    PhotoAlbum: http://www.galasoft-LB.ch/pictures
    Support children in Calcutta: http://www.calcutta-espoir.ch
     
    Laurent Bugnion [MVP], Jan 23, 2007
    #4
  5. Gabriella

    ASM Guest

    Gabriella a écrit :
    > Another question:
    > I want to refresh the opener page immediately after closing the popup.
    > How do I do that?


    You must do it *before* to close the popup :

    opener.location.reload();
    or (depends what you want) :
    opener.location = opener.location

    Vedere gli esempi dati al vostro compatriota :
    http://stephane.moriaux.perso.wanadoo.fr/truc/tutticanti/

    > Why are popups not recommended?


    because most of surfer have anti-popups that could block yours.
    Because Firefox by default open accepted popups in a tab (and this tab
    is not allways automatically opened)

    > Can you show me how to use an inline floading DIV instead?


    ask to Google : tolltip
    http://www.walterzorn.com/tooltip/tooltip_e.htm
    very much heavy and hard to understand :
    http://developer.yahoo.com/yui/container/tooltip/

    ask to Google : modal dialog
    http://sublog.subimage.com/articles/2006/01/01/subModal



    --
    Stephane Moriaux et son (moins) vieux Mac déjà dépassé
    Stephane Moriaux and his (less) old Mac already out of date
     
    ASM, Jan 23, 2007
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Matt Jensen
    Replies:
    1
    Views:
    5,271
    Matt Jensen
    Dec 16, 2005
  2. Replies:
    2
    Views:
    6,369
  3. Jens Peter Hansen
    Replies:
    7
    Views:
    593
    Randy Webb
    Jun 19, 2004
  4. Replies:
    2
    Views:
    400
  5. Shang Wenbin

    close current window using window.close()

    Shang Wenbin, Sep 1, 2005, in forum: Javascript
    Replies:
    10
    Views:
    422
    Gérard Talbot
    Sep 2, 2005
Loading...

Share This Page