JSFiddle - React, Tailwind, and code Playground

by acturbo

HTML

<div id="dialog">
    <p>this will be shown in a dialog</p>
<input id="txtfirst" type="text" />
<input id="txtlast" type="text" />
<input type="button" value="Submit" /> 
</div>

<div id="makeDialog">Click to make the dialog</div>

CSS

#makeDialog{
    cursor: pointer;
}

JavaScript

$(function() {    
 
	$( "#makeDialog" ).on("click", function(){
       
	  $('#dialog').dialog({
		autoOpen: true,
			width: 400,
			resizable: false,
			title: 'My Table',
			modal: true,
			open: function (event, ui) {
			
					var param1 = $('#txtfirst').val();
					var param2 = $('#txtlast').val();
                var url = "@(Html.Raw(Url.Action('Index1', new { first : param1, last : param2 })))";
                alert(url);
					$(this).load(url);					
			}
		 });          
	 });
});