diff options
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> |