Tag <form>
A tag <form> no HTML define um formulário na página, permitindo a coleta de informações do usuário. Dentro dessa tag, são agrupados diferentes elementos, como campos de texto, botões, caixas de seleção, entre outros, que compõem o formulário a ser preenchido e enviado pelo usuário.
Principais atributos
Atributo action
Define a URL para onde os dados do formulário serão enviados após a submissão. Essa URL pode ser um script de servidor que processará os dados do formulário.
<form action="/processar" method="post">
<!-- Elementos do formulário aqui -->
</form>Atributo autocomplete
Controla se o navegador deve ou não fornecer sugestões automáticas para os campos do formulário. “on” é o comportamento padrão, enquanto “off” desativa essa funcionalidade.
<form action="/processar" method="post" autocomplete="off">
<!-- Elementos do formulário aqui -->
</form>Atributo method
Especifica o método HTTP usado para enviar os dados do formulário. Pode ser “POST” ou “GET”, influenciando como os dados são enviados e processados no servidor.
<form action="/processar" method="post">
<!-- Elementos do formulário aqui -->
</form>Atributo enctype
Define como os dados do formulário devem ser codificados antes de serem enviados. Geralmente usado com formulários que incluem o envio de arquivos. Os valores comuns são application/x-www-form-urlencoded e multipart/form-data.
<form action="/upload" method="post" enctype="multipart/form-data">
<!-- Elementos do formulário aqui -->
</form>Atributo target
Especifica onde abrir o resultado do envio do formulário. Pode ser _self para recarregar a página atual ou _blank para abrir em um novo guia.
<form action="/processar" method="post" target="_blank">
<!-- Elementos do formulário aqui -->
</form>Validação de dados
A tag <form> suporta a validação de dados do lado do cliente, utilizando atributos como required, pattern, e outros. No entanto, a validação do lado do servidor também é crucial para garantir a integridade e segurança dos dados recebidos.
Nota
O atributo
novalidateindica ao navegador para não fazer uma validação prévia no envio dos dados. Isso varia de navegador para navegador.
Exemplo
<form action="/processar" method="post">
<label for="nome">Nome:</label>
<input type="text" id="nome" name="nome" required>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<button type="submit">Enviar</button>
</form>