JSFiddle - React, Tailwind, and code Playground
HTML
<form id="formWebUI" class="form-inline pb-5" action="sdf" method="POST">
<div class="container">
<div class="row">
<div class="col-3 p-0">
<div class="form-group">
<input type="text" class="form-control w-100" id="alias" name="alias" placeholder="Alias">
</div>
</div>
<div class="col-7 px-1">
<div class="form-group">
<input type="text" class="form-control w-100" id="text" name="text" placeholder="Text">
</div>
</div>
<div class="col-2 p-0">
<input type="submit" class="btn btn-secondary w-100" value="Add">
</div>
</div>
</div>
</form>
JavaScript
$( document ).ready(function() {
$('#formWebUI').submit(function(e) {
e.preventDefault();
e.stopPropagation();
e.stopImmediatePropagation();
let form = $(this);
let url = form.attr('action');
$.ajax({
type: "POST",
url: url,
data: form.serialize(), // serializes the form's elements.
success: function(data)
{
ChangeLocation();
}
});
return false;
});
});