JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://code.jquery.com/ui/1.8.22/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.22/themes/base/jquery-ui.css">
<div id="customserver-container" class="ui-widget hidden">
<p>Please enter custom parameters for launching server</p>
<form action="/instance/exec/ins_id/9" method="get" id="customserver-form">
<input type="file" class="hidden" id="file-input" />
<fieldset>
<dl>
<dt><label for="port">Server Port:</label></dt>
<dd><input type="text" id="port" name="port" value="" size="5"/></dd>
<dt><label for="ora_login">Oracle Login:</label></dt>
<dd><input type="text" id="ora_login" name="ora_login" value="" size="30"/></dd>
<dt><label for="ora_password">Oracle Password:</label></dt>
<dd><input type="text" id="ora_password" name="ora_password" value="" size="30"/></dd>
<dt><label for="ora_tns">Oracle TNS:</label></dt>
<dd><input type="text" id="ora_tns" name="ora_tns" value="" size="30"/></dd>
<dt><label for="config_file">Configuration File</label></dt>
<dd>
<input type="text" id="config_file" name="config_file" value='' size="30" />
<!-- Disabled, don't work <input type="button" value="..." onclick="browse()" /> -->
</dd>
<dt><label for="overwrite_file">Overwrite existing config file?</label></dt>
<dd><input type="checkbox" id="overwrite_file" name="overwrite_file" checked="checked"/></dd>
</dl>
</fieldset>
</form>
</div>
CSS
.hidden
{
display:none;
}
JavaScript
function customServer()
{
var form = $('#customserver-form');
$('#customserver-container').dialog({
title:"Launch Custom Server",
width:550,
modal:true,
buttons:{
"Launch": function()
{
var formData = form.serialize();
launchApp('9','CompilServer',formData);
$(this).dialog('close');
},
"Reset": function()
{
form.get(0).reset();
},
"Cancel": function()
{
$(this).dialog('close');
}
}
});
}
customServer();