JSFiddle - React, Tailwind, and code Playground

by TJ VanToll

HTML

<link href="http://code.jquery.com/ui/jquery-ui-git.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-git.js"></script>
<script src="http://code.jquery.com/ui/jquery-ui-git.js"></script>

<div id="dialog1"></div>
<div id="dialog2"></div>
<input id="input1">

JavaScript

$( "#dialog1, #dialog2" ).dialog({ autoOpen: false, modal:true });

$( "#dialog1" ).on( "dialogbeforeclose", function() {
    $( "#dialog2" ).dialog( "open" );
    
    setTimeout( function() {
        $( "#dialog2" ).dialog( "close" );
        setTimeout(function() {
            $( "#input1" ).focus();
        }, 200 );
    }, 200 );
});

setTimeout( function() {
    $( "#dialog1" ).dialog( "open" );
    
    setTimeout( function() {
        $( "#dialog1" ).dialog( "close" );
    }, 200 );
}, 200 );