<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Better Form Validation</title> <script> function isEmpty(s) { var valid = /\S+/.test(s); return !valid; } function validate() { if (isEmpty(document.myform.userFname.value)) { alert("Error: First Name is required."); document.myform.userFname.focus(); return false; } if (isEmpty(document.myform.userLname.value)) { alert("Error: Last Name is required."); document.myform.userLname.focus(); return false; } return true; } window.onload = function(){ document.getElementById("myform").onsubmit = validate; }; </script> </head> <body> <form name="myform" id="myform" method="get" action="http://www.javascriptref.com"> First name: <input type="text" name="userFname" id="userFname" size="30" maxlength="60"> <br> Last name: <input type="text" name="userLname" id="userLname" size="30" maxlength="60"> <br> <input type="submit" value="Submit"> </form> </body> </html>
Tuesday, December 25, 2012
Simple Verification Html for my Scripting Class
Scripting 1101 Stuff
Code from and assignment in my Scripting technologies class
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="EN" dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/xml; charset=utf-8" />
<title>innerHtml.html</title>
<script type = "text/javascript">
//<![CDATA[
//get names
function welcomeStudent(){
txtName = document.getElementById("txtName");
ltxtName = document.getElementById("ltxtName");
divOutput = document.getElementById("divOutput");
name = txtName.value;
lname = ltxtName.value;
divOutput.innerHTML = " Welcome";
divOutput.innerHTML += "<em>" + name + " " + lname + "<\/em>";
divOutput.innerHTML += " to CIST 1520.";
}
// change backgroundColors
function changeColor(color){
document.body.style.backgroundColor = color;
} // end changeColor
//]]>
</script>
</head>
<body>
<h1>Click a button to change the color</h1>
<form action = "">
<fieldset>
<input type = "button"
value = "blue"
onclick = "changeColor('blue')"/>
<input type = "button"
value = "green"
onclick = "changeColor('green')" />
<input type = "button"
value = "red"
onclick = "changeColor('red')" />
</fieldset>
</form>
<h1>Welcome to Cist 1520 Assignment 6</h1>
<form action = "">
<fieldset>
<label>Please type your first name</label>
<input type = "text"
id = "txtName" />
<label>Please type your last name</label>
<input type = "text"
id = "ltxtName" />
<button type = "button"
onclick = "welcomeStudent()">
Display Greeting
</button>
</fieldset>
</form>
<div id = "divOutput">
Your Message Will Appear Here!
</div>
</body>
</html>
The Code above helps to understand how innerHTML works..
Subscribe to:
Posts (Atom)