-
Senha: precisa ter ao menos um número, uma letra maiúscula, uma letra minúscula e de 6 a 20 caracteres.
-
Email: não pode iniciar com números, e não pode conter nenhum outro caractere exceto: @, ., A-z, e 0-9. 2.1 Exemplos corretos: user@gmail.com, user32@email.com
-
Data de nascimento: é validade seguindo a seguinte estrutura: Y-M-D.
-
nome: deve conter apenas um espaço entre as palavras e apenas letras, sendo permitidos caracteres acentuados.
- Validator.js - responsável por detectar o clicque no botão e validar o formulário do qual o referido botão pertence.
- DataValidator.js - responsável por validar os dados em si, pois possui as funções necessárias para tal.
- Notificator.js - responsável por exibir uma div contendo os inputs com dados inválidos.
O método construtor da classe Validator recebe como parâmetro um botão que possui um atributo data-form contendo o id do formulário. O id é necessário para a classe Validator pegar os dados do formulário com a interface FormData.
Assim, a classe Validator tem um método que corre por todos os inputs e valida cada um com o auxilio da classe DataValidator.
Caso houver algum input inválido, o atributo name desse input é armazenado numa variável da classe Validator. Essa variável é posteriormente enviada a um método da classe Notificator, que se encarrega de exibir a mensagem de erro respectiva para aquele input.
A interface desenvolvida apresenta dois formulários: um de login e outro de registro. O primeiro formulário apresenta dados incorretos, que serão negados pelo JavaScript e será exibida uma notificação com os campos incorretos, que terão a cor de suas bordas mudados para vermelho. O segundo apresenta dados corretos e será exibido um alert dizendo que a operação foi realizada com sucesso.
Você também pode mudar os valores para testar mais o aplicativo (: