Is it possible to clear form
or fields after the call without pressing any button? In my case the user changes the menu and the data continues.
Call menu: Menu
Content Page: Content
Yes there is, you can call the reset of the form with
document.getElementById('minhaForm').reset();
What this method does is restore the original form values.
If the form is submitted via AJAX, ie without reloading the page, you can join this code up within the AJAX success function.
If the page loads again, then the fields are already clean.
Example: link
As you can see in JSFiddle in your question, the forms for each tab are within iframe
. So, in the function that takes care of the change of tab, apply the following code:
// localizar a iFrame
var minhaFrame = document.getElementById( iframeID );
// localizar o conteudo da iframe
var minhaFrameDoc = minhaFrame.contentDocument || minhaFrame.contentWindow.document;
// localizar o formulário dentro da iframe pelo ID do formulario
var meuFormulario = minhaFrameDoc.getElementById( formID );
// repor formulário a vazio conforme resposta do @Sergio
meuFormulario.reset();
Your Alter()
function will be:
function Alter(menu,conteudo)
{
for (i=0;i<arAbas.length;i++)
{
m = document.getElementById(arAbas[i].menu);
m.className = 'menu';
c = document.getElementById(arAbas[i].conteudo)
c.style.display = 'none';
}
m = document.getElementById(menu)
m.className = 'menu-sel';
c = document.getElementById(conteudo)
c.style.display = '';
var minhaFrame = c.getElementById( iframeID );
var minhaFrameDoc = minhaFrame.contentDocument || minhaFrame.contentWindow.document;
var meuFormulario = minhaFrameDoc.getElementById( formID );
// repor formulário a vazio conforme resposta do @Sergio
meuFormulario.reset();
}
For this to work, you should have a id
unique in each iframe
as well as a id
unique in each form:
Iframe
<table border="0" width="50%">
<tr>
<td>
<iframe id="iframeID" style="border-radius:20px;" scrolling="no" src="../sai_cada_usua/sai_frm_incl_usua.php" width="830" height="310" >
</iframe>
</td>
</tr>
</table>
Form
<form name="sai_frm_incl_usua1" id="formID" action="sai_incl_usua" method="POST" autocomplete="off" onsubmit="return f_veri_dados();">
<!-- conteúdo do formulário -->
</form>
In this way, whenever the user clicks to change the tab, the form that will be presented will be cleared by JavaScript, thus not having anything filled in the fields of it.