https://github.com/renatobritodev/form-validation

Formulário desenvolvido utilizando as tecnologias HTML, CSS e JavaScript.
https://github.com/renatobritodev/form-validation

css3 favicon font-awesome html5 javascript markdown regex

Last synced: about 1 month ago
JSON representation

Formulário desenvolvido utilizando as tecnologias HTML, CSS e JavaScript.

• Host: GitHub
• URL: https://github.com/renatobritodev/form-validation
• Owner: renatobritodev
• Created: 2024-04-14T03:59:00.000Z (9 months ago)
• Default Branch: main
• Last Pushed: 2024-04-14T05:18:17.000Z (9 months ago)
• Last Synced: 2024-11-22T04:14:06.839Z (about 1 month ago)
• Topics: css3, favicon, font-awesome, html5, javascript, markdown, regex
• Language: HTML
• Homepage:
• Size: 98.6 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Formulário com Validação em JavaScript

Este é um exemplo de como implementar um formulário com validação utilizando JavaScript. A validação é essencial para garantir que os dados inseridos pelos usuários sejam corretos antes do envio.

## Funcionalidades

- **Validação de Campos:** Verifica se os campos obrigatórios estão preenchidos e se os dados inseridos são válidos (ex: email válido).

- **Exibição de Mensagens de Erro:** Ao detectar um erro de validação, mensagens são exibidas abaixo dos campos correspondentes para orientar o usuário sobre como corrigir o problema.

- **Prevenção de Envio de Formulário:** O formulário não é enviado até que todos os campos estejam preenchidos corretamente.

## Como Usar

- Clone ou faça o download deste repositório.

- Abra o arquivo index.html em seu navegador.

- Experimente enviar o formulário com campos vazios ou dados inválidos para ver a validação em ação.

## Personalização

- Adicione mais campos ao formulário conforme necessário, garantindo que a validação seja ajustada para cada novo campo adicionado.

- Personalize as mensagens de erro e o estilo conforme o design da sua aplicação.

------------

![Formulário Inicial](assets/img/initial_form.png)

**Formulário inicial**

------------

![Formulário Inicial](assets/img/error_form.png)

**Formulário erro**

------------

![Formulário Inicial](assets/img/validated_form.png)

**Formulário válidado**

### Feito com :heart: por: Renato Brito