JSFiddle - React, Tailwind, and code Playground

by sarowar

HTML

<input id="click" type="button" value="click"/>
<input id="click" type="button" class="test-open" value="Extract"/>

<div data-role="popup" id="archivePopup" class="ui-corner-all">
				<div class="ui-popup-title">
					<h1>Archive file list<h1>
				</div>
				<div id="archiveList" class="ui-popup-text" >
					<p class="text"></p>
				</div>

				<div class="ui-popup-button-bg">
					<a  data-role="button" data-rel="back" data-inline="true">Cancel</a>
					<a id="extractActionBtn" data-role="button" data-rel="back" data-inline="true" class="confirm test-open">Extract</a>
				</div>
</div>
                    
<div data-role="popup" id="confirmPopup" data-position-to="window" class="ui-corner-all">
				<div class="ui-popup-text">
					<p class="text">hello</p>
				</div>
				<div class="ui-popup-button-bg">
					<a data-role="button" data-rel="back" data-inline="true">Cancel</a>
					<a data-role="button" data-rel="back" data-inline="true" class="confirm">OK</a>
				</div>
</div>

JavaScript

$("#click").click(function(){
    $("#archivePopup").popup("open");
    /*setTimeout(function(){$("#archivePopup").popup("close");},500);
    setTimeout(function(){
        if($(".ui-popup-active").length > 0){
            console.log("active");
            $('#archivePopup').one("popupafterclose", function(){$('#confirmPopup').popup("open")}).popup("close");
        }else{
            $('#confirmPopup').popup("open")
        }
        },5000);*/
});


$(".test-open").click(function(){
    //$("#confirmPopup").popup("open");
    $('#archivePopup').one("popupafterclose", function(){$('#confirmPopup').popup("open")}).popup("close")
});
/*
$('#archivePopup').one("popupafterclose", function(){$('#confirmPopup').popup("open")}).popup("close")
*/