ansaurus

Question

jquery modal windows - closing frustrations with greybox and jqmodal

Answer 1

+3 A:

If I read your issue right, you simply are having problems closing the modal dialog.

I just put together an example using jqModal:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script src="Scripts/tmp/jqModal.js" type="text/javascript"></script>
<style type="text/css">
    .jqmWindow
    {
        display: none;
        position: fixed;
        top: 17%;
        left: 50%;
        margin-left: -300px;
        width: 600px;
        background-color: #EEE;
        color: #333;
        border: 1px solid black;
        padding: 12px;
    }
    .jqmOverlay
    {
        background-color: #000;
    }
 .jqmWindow
    {
        position: absolute;

    }
</style>
<script type="text/javascript">
    $().ready(function() {
        $('#dialog').jqm();

        $('#jqmOpen').click(function() {
            $('#dialog').jqmShow();
            return false;
        });
    });
</script>
</head>
<body>
<a href="#" id="jqmOpen" name="jqmOpen">Open</a>
<div class="jqmWindow" id="dialog">
    <a href="#" class="jqmClose">Close</a>
    <input type="button" class="jqmClose" value="Close" id="jqmCloseBtn" name="jqmCloseBtn" />
    Some text in the modal dialog
   </div>
</body>
</html>

I have put both a hyperlink and a button just for example. It appears that jqModal needs/looks for the class to attach the close trigger.

EDIT:

I just tried your exact code from above and I didn't get a JavaScript error but also nothing happened, which is to be expected as my code does not know what GB_hide() is. So this got me thinking.

Is the button your clicking on like:

<input type="button" value="Close" id="Button1" name="Button1" onclick="parent.parent.GB_hide();" />

If so what is parent.parent.GB_hide()? Could GB_hide() be a function your are not implementing on this page.

Firebug shows me that parent.parent is the Window, so after putting:

<script type="text/javascript">
    function GB_hide() {
        alert('Close');
    }
</script>

on the page I now get an alert displayed.

Nick Clarke 2009-08-05 16:03:42

Thanks, Nick. I understand how it works and have it working in some cases. I'm trying to figure out why the modal on one page closes as expected, but the one on another pages refuses to do so.

2009-08-05 16:04:37

Most times I have had issues like this it has been caused by some unrelated JavaScript error. Do you have an example you can post/host?

Nick Clarke 2009-08-05 16:13:55

Not right now. My JavaScript debugging skills are pretty slim, so if you could suggest a particular place to look or way to debug that might prove helpful. Thanks!

2009-08-05 16:18:09

By far the best debugging tool is http://getfirebug.com, there is both a full Firefox plugin and a light version for other browsers. Firebug also has lots of plugins inself.

Nick Clarke 2009-08-05 16:23:21

I mean Lite version not light :)

Nick Clarke 2009-08-05 16:24:26

One of the first things you should do is check page validity and then check for javascript errors. Both can be done in FF from the web developer toolbar.

James S 2009-08-05 16:27:04

ansaurus

tags:

views:

answers:

jquery modal windows - closing frustrations with greybox and jqmodal

related questions