Close jQuery popup (external page) window

1.5k Views Asked by At

Setup:

Popup Page:

<html>
    <head>
        <title>popup page</title>
    </head>
    <body>
        <label for="txtArea">Comments:</label>
        <textarea id="txtArea" type="text" rows="5" cols="25">
        </textarea>
        <input type="submit" value="submit" />&nbsp;
            <input type="button" value="cancel" />
    </body>
</html>

Main Page:

<html>
    <head>
        <title>popup page</title>
    </head>
    <body>
        <a href="#" id="lnkPopup">Post Comment</a>
    </body>
</html>

Problem:

I want to open the popup page on clicking of link in main page. This is easily achievable with so many awsome jQuery plugins, but tht problem is that I want to close the popup when user clicks submit or cancel button. How can I achieve this? I have seen exemples where another block from same page is shown and we have IDs of elements in it but not the external page.

1

There are 1 best solutions below

0
On BEST ANSWER

As you are already using jQuery you could open your popup as a modal window.

One good plugin for this scenario is Fancybox

From within the modal window you can easily close the window pressing the submit button:

<script type="text/javascript" language="javascript">
  $(document).ready(function(){
    $("form#yourform").submit(function() {
       parent.$.fancybox.close();
     });});
</script>