CODEWITHSUNDEEP
jqueryiframe
Sush
Sush

Reputation: 87

How to close jQuery dialog box with Iframe

I created a div for a dialog box and loaded an iframe inside the div.

My problem is I am not able to close the dialog box clicking a button from within the iframe with an aspx page.

I tried the code below. It is working if I use an iframe directly as a dialog box instead of a div, but it will create other issues for resize / dragging dialog box and iframe.

window.parent.$('#divdialog').dialog('close');

Appreciate a feasible solution for this issue.

Upvotes: 2

Views: 2209

Answers (3)

Sush
Sush

Reputation: 87

Thanks guys.. Finally I got solution.

Here is the code used in iframe:-

window.parent.CloseDialog();

Here is the code used in parent page:-

var divdialog = $('#divdialog'); divdialog.dialog('destroy');
        divdialog.dialog({
            autoOpen: true,
            height: 310,
            width: 570,title: "Look Up",
            modal: true,
            open: function () {$('#testframe').attr("src", strValue);
            $('#testframe').height($(this).height()-5);       $('#testframe').width($(this).width()-10);         
                },
            close: function (e) {
                $('#divdialog').remove();
                },
            resizable: true,
            resize: function() { $('#divdialog iframe').hide(); },
            resizeStop: function() { $('#divdialog iframe').show(); 
            $('#divdialog iframe').height($(this).height()-10);  
            $('#divdialog iframe').width($(this).width()-10); } ,
            closeOnEscape:true,
            draggable:true
        })

function CloseDialog()
{
    $('#divdialog').dialog('close'); return false;
}

Upvotes: 2

Nikola Sivkov
Nikola Sivkov

Reputation: 2852

I would suggest you add some buttons to the dialog.

$( ".selector" ).dialog({ 
buttons: [ { text: "Ok", click: function() { $( this ).dialog( "close" ); } ] 
});

Upvotes: 0

Aristos
Aristos

Reputation: 66641

When you try to reach elements that is on the main page from the iframe code you need to use the window.top.document on the selectors as:

jQuery("#ElementID", window.top.document)

with that parameter the selector is search the page that contains the iframe, so you can close your dialog box.

and your code will be:

$('#divdialog', window.top.document).dialog('close');

Upvotes: 0

Related Questions