diff options
author | Nguyễn Gia Phong <mcsinyx@disroot.org> | 2020-12-03 09:32:13 +0700 |
---|---|---|
committer | Nguyễn Gia Phong <mcsinyx@disroot.org> | 2020-12-03 09:32:13 +0700 |
commit | 8644699f4d2fce12a41289f9627bc45be9dd1965 (patch) | |
tree | d31190ac36d10e297eeab0f6e7a70dc24395695d /usth/ICT3.2/midterm/2.html | |
parent | 82048ad9e3e4a96a38c8fa6a529798f40e33acb1 (diff) | |
download | cp-8644699f4d2fce12a41289f9627bc45be9dd1965.tar.gz |
[usth/ICT3.2] Develop web applications
Diffstat (limited to 'usth/ICT3.2/midterm/2.html')
-rw-r--r-- | usth/ICT3.2/midterm/2.html | 82 |
1 files changed, 82 insertions, 0 deletions
diff --git a/usth/ICT3.2/midterm/2.html b/usth/ICT3.2/midterm/2.html new file mode 100644 index 0000000..106147b --- /dev/null +++ b/usth/ICT3.2/midterm/2.html @@ -0,0 +1,82 @@ +<!DOCTYPE html> +<style> +h1 { text-align: center } +form { + display: table; + margin: 0 auto; +} +p { display: table-row } +.cell { + margin: 0.2em 0; +} +</style> + +<script> +function check() { + const AGE = document.getElementById('age').value; + // Number check is already handled by the number input. + if (AGE < 0) + alert('Age must be nonnegative.'); + + const EMAIL = document.getElementById('email').value; + if (EMAIL.match(/\w+@\w+\.\w+/) === null) + alert('Invalid email!'); + + const USER = document.getElementById('user').value; + if (USER === '') + alert('Your username is blank! Please enter a nonempty username.'); + + const PW = document.getElementById('pw').value; + const PW2 = document.getElementById('pw2').value; + if (PW != PW2) + alert('Your password and confirmation password do not match!'); +} +</script> + +<html> +<body> + <h1>Sign Up</h1> + <form> + <p> + <label class=cell for=name>Full name: </label> + <input class=cell type=text id=name> + </p> + <p> + <label class=cell for=gender>Gender: </label> + <select name=gender id=gender> + <option value=''>-Select one-</option> + <option value=male>Male</option> + <option value=female>Female</option> + <option value=other>Other</option> + </select> + </p> + <p> + <label class=cell for=age>Age: </label> + <input class=cell type=number id=age> + </p> + <p> + <label class=cell for=email>Email: </label> + <input class=cell type=email id=email> + </p> + <p> + <label class=cell for=user>Username: </label> + <input class=cell type=text id=user> + </p> + <p> + <label class=cell for=pw>Password: </label> + <input class=cell type=password id=pw> + </p> + <p> + <label class=cell for=pw2>Re-type Password: </label> + <input class=cell type=password id=pw2> + </p> + <p> + <span class=cell></span> + <span class=cell> + <input type=reset value=Clear> + <input type=button onclick='check()' value=Submit> + </span> + </p> + </form> +</body> +</html> |