JavaScriptTutorial/form_validation.html at master · colorfest/JavaScriptTutorial · 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
<!doctype html>
<html lang="en">
<head>
	<title>JavaScript Tutorial - Form Validation</title>
	<link rel="stylesheet" href="css/foundation.min.css"></link>
</head>

<body>

	<form name="newForm">
		<label>Username:</label> <input type="text" name="username">
		<label>Password:</label> <input type="password" name="password">
		<input type="button" value="Validate" id="submitBtn" class="button">
	</form>


	<!-- JAVASCRIPT -->
	<script type="text/javascript">
		var submitBtn 		= document.getElementById('submitBtn');
		submitBtn.addEventListener("click", validateForm);

		function validateForm()
		{
			var uname 			= document.newForm.username.value;
			var pword 			= document.newForm.password.value;

			if((uname == "") && (pword == ""))
			{
				alert('You need to fill out the form!!!!');
			}
			else
			{
				console.log('You have entered info.');
			}
		}


	</script>
	<!-- END JAVASCRIPT -->
</body>
</html>