Formulários

Formulários são ferramentas essenciais para coletar dados dos usuários e enviá-los a um servidor para processamento. Eles são compostos por diferentes elementos de formulário que permitem a entrada de dados pelo usuário. No entanto, neste curso, não enviaremos nenhum dado para um servidor, pois isso exige conhecimentos adicionais que estão fora do escopo deste curso.

Todos os exemplos no código possuem o atributo onsubmit="return false". Esse atributo impede que o formulário envie uma requisição ao servidor por padrão.

Criando Formulários

Utilize a tag <form> para criar um formulário interativo.

<form>
  <!-- Form elements go here -->
</form>

Elementos de Formulário

Formulários contêm rótulos e vários tipos de entrada (texto, senha, e-mail, etc.). Rótulos conectam o texto aos campos de entrada e melhoram a acessibilidade. Você aprenderá mais sobre rótulos e tipos de entrada nos próximos capítulos.

<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
</form>

Envio de Formulário

Um formulário é enviado utilizando um botão com type="submit".

<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
  <button type="submit">Submit</button>
</form>

Aqui está o exemplo básico de formulário.