<!DOCTYPE html>
<html>
<body>
<h1>Basic HTML form</h1>
<form name="basicform" action="form.html" method="post" onsubmit="return validate()">
<p>Password: </p><input type="text" name="password" id="password" placeholder="required" /><br /><span id="pass_err"></span><br />
<p>Re-type password: </p><input type="text" name="retype_password" id="retype_password" placeholder="required" /><br /><span id="repass_err"></span><br />
<p id="error"></p><br />
<button type="submit" id="submit">Submit</button>
</form>
</body>
</html>function validate() {
form = document.forms["basicform"]
document.getElementById("pass_err").innerHTML = ""
document.getElementById("repass_err").innerHTML = ""
document.getElementById("error").innerHTML = ""
if (form.password.value == "")
{
document.getElementById("pass_err").innerHTML = "Password is Required"
return false
}
else if (form.retype_password.value == "")
{
document.getElementById("repass_err").innerHTML = "Re-type password is Required"
return false
}
else
{
if (form.password.value == form.retype_password.value)
{
alert("Done")
return true
}
else
{
document.getElementById("error").innerHTML = "Password and Re-type password fields must be same"
return false
}
}
}
External CSS
This Pen doesn't use any external CSS resources.
External JavaScript
This Pen doesn't use any external JavaScript resources.