Formulario/Formulario.html at main · Jovane-bot/Formulario · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <title>Formulario</title>
    <link rel="stylesheet" href="Formulario_css.css">
</head>
<body>

    <h1><p>HTML Formulario</p></h1>
    <main>
    <form>
          <p>
          <label>NOME E SOBRENOME:</label>
          <input type="text" id="name" name="name" value=""><br>

          <label>DATA DE NASCIMENTO:</label>
          <input type="date" id="date" name="date" value=""><br>

          <label>ENDEREÇO DE EMAIL:</label>
          <input type="email" id="email" name="email" value=""><br>

          <label>NUMERO DE CELULAR:</label>
          <input type="phone" id="phone" name="phone" value=""><br>

          <button type="enviar" onclick="ButtonEnviar()" id="enviar" name="enviar">SUBMIT</button>

          <button type="reset" id="reset" name="reset">RESET</button>
        </p>
    </form>
    </main>
    <script>
        class Pessoa {

            constructor(PrimeiroNome, SegundoNome, Nascimento, Email, Celular) {
                this.PrimeiroNome = PrimeiroNome;
                this.SegundoNome = SegundoNome;
                this.Nascimento = Nascimento;
                this.Email = Email;
                this.Celular = Celular;
            }
            getPrimeiroNome() {
                return this.PrimeiroNome;
            }
            getSegundoNome() {
                return this.SegundoNome;
            }
            getNascimento() {
                return this.Nascimento;
            }
            getEmail() {
                return this.Email;
            }
            getCelular() {
                return this.Celular;
            }
        }
        function ButtonEnviar() {
            event.preventDefault();
            var PrimeiroNome = (document.getElementById("1name").value);

            var SegundoNome = (document.getElementById("2name").value);

            var DataDeNascimento = document.getElementById("3name").value;

            var Email = document.getElementById("4name").value;
            var ConfirmacaoEmail;

            var Celular = document.getElementById("5name").value;
            var ConfirmacaoCelular;

            var Nascimento = new Date(DataDeNascimento);

            function ValidacaoEmail(email) {
                emailvalid = /\S+@\S+\.\S+/;
                return emailvalid.test(email);
            }
            if (ValidacaoEmail(Email) == true) {
                ConfirmacaoEmail = Email;
            } else {
                alert("Email incorreto");
            }
            Celular = Celular.replace(" ", "");
            function ValidacaoCaracter(phone) {
                var regex = new RegExp('^((1[1-9])|([2-9][0-9]))((3[0-9]{3}[0-9]{4})|(9[0-9]{3}[0-9]{5}))$');
                return regex.test(phone);
            }
            function ValidacaoCaracter1(phone1) {
                var regex = new RegExp('^\\(((1[1-9])|([2-9][0-9]))\\)((3[0-9]{3}- [0-9]{5})|(9[0-9]{3}-[0-9]{5}))$');
                return regex.test(phone1);
            }
            if (ValidacaoCaracter(Celular) || ValidacaoCaracter1(Celular) == true) {
                ConfirmacaoCelular = Celular;
            } else {
                alert("Numero de telefone incorreto");
            }
            var usuario = new Pessoa(PrimeiroNome, SegundoNome, Nascimento, ConfirmacaoEmail, ConfirmacaoCelular);

            console.log(usuario.getPrimeiroNome(), usuario.getSegundoNome(), usuario.getNascimento(), usuario.getEmail(), usuario.getCelular());
        }
        </script>
    </body>
</html>