In: Computer Science
Can anyone add a validation function to my html? First, ensure that your form uses at least three of the following field types: check boxes, text boxes, option buttons, selection lists, and text areas. Then, program validation for your form ensuring that users enter values or make selections in all fields, and verifying at least one other aspect of at least one of the fields. Provide appropriate feedback to users when the form fails validation. Test your completed program until all validation works reliably with different combinations of valid and erroneous data.
<------------------------------------------------------------------------------------------------------->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Case Project</title>
<link href="layout.css" rel="stylesheet"
type="text/css">
</head>
<body>
<h1>Lamborghini</h1>
<p><a href='index.html'>Lamborghini</a> <a
href='ferrari.html'>Ferrari</a> <a
href='bugatti.html'>Bugatti</a> <a
href='rollsroyce.html'>Rolls-Royce</a></p>
<hr>
<p><img
src='https://vignette.wikia.nocookie.net/pawnstarsthegame/images/6/6e/2003_Lamborghini_Murcielago.png'>The
Aventador has been created to anticipate the future, as
demonstrated by the use of innovative technology, including a V12
engine and the extensive use of carbon fiber. The authentic design
masterpieces together stark dynamism with aggression to produce a
cutting edge carbon fiber monocoque. The interior of the Aventador
combines high-level technology and luxury equipment with
premium-quality materials, skilfully crafted with the expertise
characteristic of the finest Italian traditions. A supercar family
that has already become a legend in its own right. Discover
technical specifications, dimensions, performance, and the detailed
features of all the new Lamborghini Aventador
models.</p>
</script>
</body>
</html>
function validateform(){
var name=document.form.name.value;
var group = document.form.yes
;
select = document.getElementById('select');
for (var i=0; i<group.length; i++) {
if (group[i].checked)
break;
}
if (i==group.length)
return alert("No radio button is checked");
alert("Radio Button " + (i+1) + " is checked.");
}
if (name==null || name==""){
alert("Please fill name");
return false;
}else if(!this.form.checkbox.checked
){
alert("Please check the box");
return false;
}
else if(select.value)
{return true;}
}
if (document.getElementById("
txtarea").value
== ""){
alert("Enter the text");
document.getElementById("
txtarea").focus();
}
else {
alert(document.getElementById("txtarea_consolidation").value);
}
<form name = "form" method="post" action="" onsubmit="return validateform()">
<input type="text" name="name"><br/> <input type="checkbox" name="checkbox" value="check"/>
<input type="radio" id="1" name="yes"
value="yes"/>
<select id="select">
<option value="">Choose an
option</option>
<option
value="option1">Option1</option>
</select>
<textarea id="txtarea"></textarea><br />
</form>