I have this code to send data by POST method, but then it does not clean the inputs:
<script type="text/javascript">
$(".btn_contact").click(function () {
$.ajax({
type: "POST",
url: "./inserir",
data: $("#feedback_form").serialize(), // serializes the form's elements.
dataType: "json",
success: function (data)
{
if ($.trim(data) == 'true') {
$("#feedback_form").find('input').val(''); //clear text
$(".success_messages").removeClass('hide'); // success message
} else {
$(".error_message").removeClass('hide'); // error message
}
}
});
});
</script>
In addition to this example I've already tried changing this line $("#feedback_form").find('input').val(''); //clear text
by:
$("#feedback_form")[0].reset('input').val(''); //clear text
by:
$("#feedback_form")[0].reset(); //clear text
by:
$('input').val(''); //clear text
by:
$('#feedback_form input').val(''); //clear text
but none of these alternatives cleaned the inputs.
Html and JS:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script><sectionclass="hide-section" id="produto_1">
<form class="form-validate" id="feedback_form">
<div class="campo">
<fieldset>
<h1>
<legend>
<center>
<strong>Produtos de Higiene</strong>
</center>
</h1><br>
</div>
<fieldset class="grupo">
<div class="campo">
<strong><label for="Nome do Produto">Nome do Produto</label></strong>
<input type="text" id="DescricaoProd" name="DescricaoProd" required="" style="width:350px">
</div>
<div class="campo">
<strong><label for="Unidade">Unidade</label></strong>
<input type="text" id="DescricaoUnid" name="DescricaoUnid" style="width:160px" required="" size="120">
</div>
</fieldset>
<button class="btn btn-success btn_contact" type="button">Registo</button>
<div id="success_messages" class="hide">sucessso</div>
<div id="error_message" class="hide">erro</div>
</form>
</section>