Quando desenvolvemos páginas web que contém formulários, uma das necessidades mais comuns é a de resetar o form, ou seja, reiniciar os valores dos seus campos, que geralmente devem ficar vazios.

Sabemos que existe um elemento padrão da HTML para efetuar essa ação, apresentando um botão para o usuário clicar para “limpar” o formulário. Trata-se do input do tipo reset, que pode ser inserido diretamente dentro do form:

Listagem 1: Input reset para limpar o form

O resultado neste caso é um botão com o texto informado no atributo value, como vemos na Figura 1.

Input reset

Figura 1: Input reset

Porém, muitas vezes precisamos limpar esse form utilizando JavaScript (principalmente quando usamos jQuery), dentro de alguma função ou de um controle diferente do input reset.

Nesse caso, podemos utilizar biblioteca jQuery para realizar essa tarefa através de uma sintaxe bastante simples:

Listagem 2: Resetando o form via jQuery

$('#id_do_form').each (function(){
  this.reset();
});

Isso faz com que todos os elementos do form com o id indicado no seletor jQuery sejam identificados e tenham seu valor resetado.

Sabendo disto podemos, por exemplo, criar uma função que possa ser chamada de qualquer parte do projeto, para termos maior reusabilidade de código.

Então essa foi a dica de hoje, bastante simples, mas que pode se mostrar bem útil no dia a dia. Até a próxima.