JSFiddle - React, Tailwind, and code Playground
HTML
<div id="dialog" title="Some dialog"></div>
<input type="button" id="open_sesame" value="Open Dialog!" />
JavaScript
$("#dialog").dialog({
title: "Dialog Box",
autoOpen: false,
open: function () {
$("#dialog").append('<p>See, I was here all the time but you do not get to see me until I am opened! </p><p> <label>Got something to say?</label><input type="text" name = "gibberish" /></p>');
},
height: 300,
modal: true,
buttons: {
"Go": function () {
$(this).dialog("close");
},
Cancel: function () {
$(this).dialog("close");
}
}
});
$("#open_sesame").click(function () {
$("#dialog").dialog("open");
});