--- title: Form Validation localeTitle: Validação de Formulário --- ## Validação de Formulário Validação de formulário normalmente usada para ocorrer no servidor, após o cliente ter inserido todos os dados necessários e, em seguida, pressionado o botão Enviar. Se os dados inserido por um cliente estava incorreto ou estava simplesmente ausente, o servidor teria que enviar todos os dados de volta para o cliente e solicitar que o formulário fosse reenviada com a informação correta. Este foi realmente um processo demorado que costumava sobrecarregar o servidor. O JavaScript fornece uma maneira de validar os dados do formulário no computador do cliente antes de enviá-lo ao servidor da web. A validação de formulários geralmente executa dois funções: ### Validação Básica Em primeiro lugar, o formulário deve ser verificado para garantir que todos os campos obrigatórios sejam preenchidos. Isso exigiria apenas um loop em cada campo no formulário e verifique os dados. ### Validação de formato de dados Em segundo lugar, os dados inseridos devem ser verificados quanto à forma e valor corretos. Seu código deve incluir lógica apropriada para testar a exatidão dos dados. #### Exemplo: ```html Form Validation
Name
EMail
Zip Code
Country
``` #### Saída Vigia [aqui](https://liveweave.com/LP9eOP) ### Validação Básica de Formulários Primeiro, vamos ver como fazer uma validação básica de formulário. Na forma acima, estamos chamando validate () para validar os dados quando o evento onsubmit está ocorrendo. o O código a seguir mostra a implementação desta função `validate()` . ```html ``` #### Saída Vigia [aqui](https://liveweave.com/pCPTnP) ### Validação de formato de dados Agora veremos como podemos validar nossos dados de formulário inseridos antes de enviá-los ao servidor da web. O exemplo a seguir mostra como validar um endereço de email inserido. Um endereço de e-mail deve conter pelo menos um sinal "@" e um ponto (.). Além disso, o '@' deve não é o primeiro caractere do endereço de e-mail, e o último ponto deve ser pelo menos um caractere após o sinal "@". #### Exemplo: ```html ``` #### Saída Vigia [aqui](https://liveweave.com/nznVs6) ### Restrições de Formulário HTML5 Algumas das restrições HTML5 comumente usadas para `` são o atributo `type` (por exemplo, `type="password"` ), `maxlength` , `required` e `disabled` . Menos A restrição comumente usada é o attrinute `pattern` que usa a expressão regular JavaScript. ### Bibliotecas de validação Exemplos de bibliotecas de validação incluem: * [Validate.js](http://rickharrison.github.com/validate.js/) * [Validação](http://bassistance.de/jquery-plugins/jquery-plugin-validation/) * [Válido8](http://unwrongest.com/projects/valid8/) ### Mais Informações * [Validação de dados de formulário | MDN](https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Form_validation) * [Validação de restrição | MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation) * [Ponto de tutoriais](https://www.tutorialspoint.com/javascript/javascript_form_validations.htm)