Validação de Formulário

A validação de formulários em JavaScript é uma técnica crucial para garantir que os dados enviados por usuários sejam corretos e seguros. Você pode usar JavaScript para validar formulários antes de serem enviados para o servidor. Aqui está um exemplo de como você pode fazer isso:

Exemplo de Validação de Formulário HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Formulário de Registro</title>
</head>
<body>
    <h1>Formulário de Registro</h1>
    <form onsubmit="return validarFormulario()">
        <label for="nome">Nome:</label>
        <input type="text" id="nome" name="nome" required><br>

        <label for="email">Email:</label>
        <input type="email" id="email" name="email" required><br>

        <label for="senha">Senha:</label>
        <input type="password" id="senha" name="senha" required><br>

        <button type="submit">Registrar</button>
    </form>

    <script>
        function validarFormulario() {
            var nome = document.getElementById("nome").value;
            var email = document.getElementById("email").value;
            var senha = document.getElementById("senha").value;

            // Validação simples: garantir que os campos não estejam vazios
            if (nome === "" || email === "" || senha === "") {
                alert("Por favor, preencha todos os campos.");
                return false;
            }

            // Validação de formato de email simples
            var emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
            if (!emailRegex.test(email)) {
                alert("Por favor, insira um endereço de email válido.");
                return false;
            }

            // Validação de senha: pelo menos 6 caracteres
            if (senha.length < 6) {
                alert("A senha deve ter pelo menos 6 caracteres.");
                return false;
            }

            // Se todas as validações passarem, o formulário será enviado
            return true;
        }
    </script>
</body>
</html>

Neste exemplo, a função validarFormulario() é chamada quando o formulário é enviado. Esta função acessa os valores dos campos de entrada, verifica se estão vazios, valida o formato do email usando uma expressão regular simples e verifica se a senha tem pelo menos 6 caracteres. Se algum dos critérios de validação falhar, a função exibirá um alerta e impedirá o envio do formulário retornando false. Se todas as validações passarem, o formulário será enviado ao servidor.