Datacode/evenjavascript.html at master · BaNguyen047/Datacode · 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
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<html>
    <head>
        <title>Github</title>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
    </head>
    <body>
        <div class="container"><br>
            <h1 class="text-success text-center"> BÀI TẬP XỬ LÝ KỊCH BẢN TRÊN FORM BẰNG JAVASCRIPT</h1><br>
            <div class="col-lg-8 m-auto d-block">
                <form action="#" onsubmit="return validation()" class="bg-light">
                    <div class="form-group">
                        <label>Username: </label>
                        <input type="text" name="user" class="form-control" id="user" autocomplete="off">
                        <span id="username" class="text-danger form-weight-bold"> </span>
                    </div>

                    <div class="form-group">
                        <label>Password: </label>
                        <input type="text" name="pass" class="form-control" id="pass" autocomplete="off">
                        <span id="Passwords" class="text-danger form-weight-bold"> </span>
                    </div>

                    <div class="form-group">
                        <label>Confirm Password: </label>
                        <input type="text" name="conpass" class="form-control" id="conpass" autocomplete="off">
                        <span id="confrmpassword" class="text-danger form-weight-bold"> </span>
                    </div>

                    <div class="form-group">
                        <label>Mobile Number: </label>
                        <input type="text" name="mobile" class="form-control" id="mobileNumber" autocomplete="off">
                        <span id="mobileno" class="text-danger form-weight-bold"> </span>
                    </div>

                    <div class="form-group">
                        <label>Email: </label>
                        <input type="text" name="email" class="form-control" id="emails" autocomplete="off">
                        <span id="emailids" class="text-danger form-weight-bold"> </span>
                    </div>

                    <input type="submit" name="submit" value="submit" class="btn btn-success" autocomplete="off">
                </form>
            </div>
        </div>

        <script type="text/JavaScript">
            function validation() {
                var user = document.getElementById('user').value;
                var pass = document.getElementById('pass').value;
                var confirmpass = document.getElementById('conpass').value;
                var mobileNumber = document.getElementById('mobileNumber').value;
                var emails = document.getElementById('emails').value;

                if (user == "") {
                    document.getElementById('username').innerHTML = " ** Bạn phải điền username";
                    return false;
                }
                if((user.length <= 2)|| (user.length > 20)){
                    document.getElementById('username').innerHTML = " ** username ít nhất 2 kí tự nhiều nhất 20 kí tự";
                    return false;
                }
                if (!isNaN(user)) {
                    document.getElementById('username').innerHTML = " ** username chỉ cho phép các kí tự";
                    return false;
                }


                if (pass == "") {
                    document.getElementById('Passwords').innerHTML = " ** Bạn phải điền password";
                    return false;
                }

                if(pass.length < 8){
                    document.getElementById('Passwords').innerHTML = " ** Password ít nhất 8 kí tự";
                    return false;
                }

                if (confirmpass == "") {
                    document.getElementById('confrmpassword').innerHTML = " ** Bạn phải điền lại password";
                    return false;
                }

                if(pass != confirmpass){
                    document.getElementById('confrmpassword').innerHTML = " ** password không khớp";
                    return false;
                }

                if (mobileNumber == "") {
                    document.getElementById('mobileno').innerHTML = " ** Bạn phải điền mobileNumber";
                    return false;
                }

                if (isNaN(mobileNumber)) {
                    document.getElementById('mobileno').innerHTML = " ** Chỉ cho phép các điền các số";
                    return false;
                }
                if (mobileNumber.length != 10 && mobileNumber.length != 11) {
                    document.getElementById('mobileno').innerHTML = " ** Số điện thoại 10 hoặc 11 chữ số";
                    return false;
                }

                if (emails == "") {
                    document.getElementById('emailids').innerHTML = " ** Bạn phải điền email";
                    return false;
                }
                if (emails.indexOF('@') <= 0) {
                    document.getElementById('emailids').innerHTML = " ** Email không hợp lệ hoặc đã được sử dụng";
                    return false;
                }
                if ((emails.charAt(emails.length-4) != '.') && (emails.charAt(emails.length-3) != '.')) {
                    document.getElementById('emailids').innerHTML = " ** Email không hợp lệ hoặc đã được sử dụng";
                    return false;
                }
            }
        </script>
    </body>
</html>