Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprenda Fundamentos da Criação de Formulários em HTML | Formulários HTML e Entrada do Usuário
HTML Definitivo
course content

Conteúdo do Curso

HTML Definitivo

HTML Definitivo

1. Compreendendo o Desenvolvimento Web
2. Tags e Atributos HTML
3. Estrutura do Documento HTML
4. Trabalhando com Mídia e Tabelas

book
Fundamentos da Criação de Formulários em HTML

O elemento <form> do HTML é um bloco fundamental para a criação de formulários interativos em uma página web. Ele serve como um contêiner para todos os elementos do formulário. Vamos explorar um exemplo de um formulário básico:

Nota

Todos os exemplos incluem o atributo onsubmit="return false" para evitar o comportamento padrão de envio do formulário. Dessa forma, o foco permanece na compreensão da criação de formulários e de seus atributos.

html

index.html

copy

Explicação dos atributos do form:

  • name fornece um identificador distinto para o formulário em uma página web. Tanto o servidor quanto o cliente utilizam esse identificador para processar os dados do formulário. O nome do formulário pode incluir números, sublinhados, traços e caracteres do alfabeto inglês, mas não deve conter espaços;
  • autocomplete determina se os navegadores podem preencher automaticamente os campos do formulário. Pode ser definido como "on" ou "off" e aplicado a elementos individuais do formulário;
  • novalidate especifica que os navegadores não devem realizar a validação dos campos do formulário. Isso pode ser útil quando a validação será feita manualmente utilizando JavaScript;
  • method especifica o método HTTP utilizado para enviar os dados do formulário ao servidor. Os dois métodos mais comuns são GET e POST. Este tema será abordado em detalhes no curso de JavaScript.

Visão geral dos elementos filhos dentro de um formulário

Dentro do elemento form, encontram-se diversos elementos filhos essenciais para a funcionalidade do formulário. O elemento input permite que os usuários insiram diferentes tipos de dados, como texto, números e datas. Neste exemplo, o type="email" é utilizado para o campo de e-mail e o type="password" para o campo de senha. O elemento label organiza e estrutura o formulário, fornecendo texto descritivo para os campos de entrada e ajudando os usuários a compreenderem suas finalidades. O elemento button com type="submit" é utilizado para enviar os dados do formulário ao servidor quando clicado. Por padrão, ao enviar o formulário, a página é recarregada, mas esse comportamento pode ser personalizado utilizando JavaScript.

question mark

Qual elemento HTML é utilizado para criar um botão de envio para um formulário?

Select the correct answer

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 5. Capítulo 2
Sentimos muito que algo saiu errado. O que aconteceu?
some-alt