<!DOCTYPE html>
<html>
<body>
	<h1>Basic HTML form</h1>
	<form name="basicform" action="form.html" method="post" onsubmit="return validate()">
		<p>Name: </p><input type="text" name="name" placeholder="required" id="name" /><span id="name_err"></span><br />	
		<p>Email: </p><input type="text" name="email" placeholder="required" id="email" /><span id="email_err"></span><br />	
		<p>Message: </p><textarea name="message" id="message" rows = "4" cols="22" padding="10"></textarea><br />
		<button type="submit" id="submit">Submit</button>
	</form>
</body>
</html>
function validate() {
	form = document.forms["basicform"]
	if (form.name.value == "") {
		document.getElementById("name_err").innerHTML = "Name is Required"
		return false
	}
	else if (form.email.value == "") {
		document.getElementById("email_err").innerHTML = "Email is Required"
		return false
	}
	else {
		document.getElementById("name_err").innerHTML = ""
		document.getElementById("email_err").innerHTML = ""
		alert("Done")
		return true
	}
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.