how to collect input textbox in html
<label for="name">Name:</label>
<input type="text" id="name"><br><br>how to collect input textbox in html
<label for="name">Name:</label>
<input type="text" id="name"><br><br>javascript onsubmit form validation
//form.html
<!DOCTYPE html>
<html>
<head>
<title>Javascript Onsubmit Event Example</title>
<link href="css/style.css" rel="stylesheet"> <!-- Include CSS File Here-->
<script src="js/onsubmit_event.js"></script>
</head>
<body>
<div class="container">
<div class="main">
<form action="#" method="post" onsubmit="return ValidationEvent()">
<h2>Javascript Onsubmit Event Example</h2>
<label>Name :</label>
<input id="name" name="name" placeholder="Name" type="text">
<label>Email :</label>
<input id="email" name="email" placeholder="Valid Email" type="text">
<label>Gender :</label>
<input id="male" name="gender" type="radio" value="Male">
<label>Male</label>
<input id="female" name="gender" type="radio" value="Female">
<label>Female</label>
<label>Contact No. :</label>
<input id="contact" name="contact" placeholder="Contact No." type="text">
<input type="submit" value="Submit">
<span>All type of validation will execute on OnSubmit Event.</span>
</form>
</div>
</div>
</body>
</html>
//js/onsubmit_event.js
// Below Function Executes On Form Submit
function ValidationEvent() {
// Storing Field Values In Variables
var name = document.getElementById("name").value;
var email = document.getElementById("email").value;
var contact = document.getElementById("contact").value;
// Regular Expression For Email
var emailReg = /^([w-.]+@([w-]+.)+[w-]{2,4})?$/;
// Conditions
if (name != '' && email != '' && contact != '') {
if (email.match(emailReg)) {
if (document.getElementById("male").checked || document.getElementById("female").checked) {
if (contact.length == 10) {
alert("All type of validation has done on OnSubmit event.");
return true;
} else {
alert("The Contact No. must be at least 10 digit long!");
return false;
}
} else {
alert("You must select gender.....!");
return false;
}
} else {
alert("Invalid Email Address...!!!");
return false;
}
} else {
alert("All fields are required.....!");
return false;
}
}Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
