JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<div id="dialog-confirm" title="Ready?">
<p>Are you sure?</p>
</div>
<form action="http://www.google.it" id="myform" name="myform2" type="post">
<input type="submit" value="Yes" name="moveOn" />
</form>
JavaScript
$(function () {
$("#dialog-confirm").dialog({
resizable: false,
height:190,
autoOpen: false,
width: 330,
modal: true,
buttons: {
"Yes": function() {
//
// Instead to submit the form trigger the
// submit event with a parameter.....
//
$('#myform').trigger('submit', true);
},
No: function() {
$(this).dialog("close");
}
}
});
$('#myform').submit(function(e) {
//
// Test is the submit has been triggered from within the dialog
//
if (!(arguments.length == 2 && arguments[1] === true)) {
$("#dialog-confirm").dialog('open');
return false;
}
});
});