jQuery.ui.domwindow - demo - widgetlike

widgetlike - minimal

Dialogs can be handled like jQuery.ui.dialog

open

$(function(){
    var $domwin = $('#iddialogcontent1').domwindow();
    $('#widgetlike1-open').click(function(){
        $domwin.domwindow('open');
    });
});

widgetlike - events

You can bind events like below.

open

$(function(){

    var $domwin = $('#iddialogcontent2').domwindow({
        width: 700,
        height: 600,
        beforeopen: function(e, data){
            console.log('option beforeopen!', data.dialog);
        },
        afteropen: function(e, data){
            console.log('option afteropen!', data.dialog);
            // bind close to buttons in dialog
            $('.widgetlike2-close', data.dialog).click(function(){
                $domwin.domwindow('close');
            });
        },
        beforeclose: function(e, data){
            console.log('option beforeclose!', data.dialog);
        },
        afterclose: function(e, data){
            console.log('option afterclose!', data.dialog);
        }
    });

    // directly binded events
    $domwin.on('domwindow.beforeopen', function(e, data){
        console.log('on beforeopen!', data.dialog);
    });
    $domwin.on('domwindow.afteropen', function(e, data){
        console.log('on afteropen!', data.dialog);
    });
    $domwin.on('domwindow.beforeclose', function(e, data){
        console.log('on beforeclose!', data.dialog);
    });
    $domwin.on('domwindow.afterclose', function(e, data){
        console.log('on afterclose!', data.dialog);
    });

    // open dialog like below
    $('#widgetlike2-open').click(function(){
        $domwin.domwindow('open');
    });

});