JQuery Dialog Box Close Event Example

In this article,I will show how to Open/destroy/auto close dialog box after x seconds. jQuery Dialog Close event gives you a very simple way to close a jQuery UI dialog box after x seconds.I have written JavaScript code to Open and Close dialog box after a certaing amount of seconds.

Example:Auto Close jQuery UI Dialog Box

<!doctype html>
<html lang="en">
<head>
    <title>Auto Close JQuery Dialog Box Example</title>
<style>
</style>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
     <script>
    $(function() {
        $( "#dialog_box" ).dialog({
            modal: true,
width:400});
    });

setInterval(function(){AutoClose()},5000);//JQuery UI Dialog box will auto close after 5 seconds.
function AutoClose()
{
$(function() {
$( "#dialog_box" ).dialog( "close" );// //Auto Close Dialog Box.
});
}

</script>
</head>
<body0>

 <div id="dialog_box" title="JQuery Dialog Box Example">
    <p>Alert Message for displaying information</p>
</div>
</body>
</html>


I hope this example will help you to Close JQuery UI dialog box after 5 seconds.