Answered: Here's the JavaScript code given. Add…

Computer Networking: A Top-Down Approach (7th Edition)

7th Edition

ISBN:9780133594140

Author:James Kurose, Keith Ross

Publisher:James Kurose, Keith Ross

Chapter1: Computer Networks And The Internet

Section: Chapter Questions

Problem R1RQ: What is the difference between a host and an end system? List several different types of end...

See similar textbooks

Related questions

Question

100%

Here's the JavaScript code given. Add some new things to it so that the First Name and Last Name boxes can take only alphabet lettes(not numbers or any symbols) and starts from an uppercase; the user id box must contain only numbers(not alphabet letters).

(Look to the picture given)

<html>
<head>
<title>Form Validation</title>
<script type="text/javascript">

var divs=new Array();
divs[0]="errFirst";
divs[1]="errLast";
divs[2]="errEmail";
divs[3]="errUid";
divs[4]="errPassword";
divs[5]="errConfirm";

function validate()
{
var inputs=new Array();
inputs[0]=document.getElementById('first').value;
inputs[1]=document.getElementById('last').value;
inputs[2]=document.getElementById('email').value;
inputs[3]=document.getElementById('uid').value;
inputs[4]=document.getElementById('password').value;
inputs[5]=document.getElementById('confirm').value;

var errors=new Array();
errors[0]="<span style='color:red'>Please enter your first name!</span>";
errors[1]="<span style='color:red'>Please enter your last name!</span>";
errors[2]="<span style='color:red'>Please enter your email!</span>";
errors[3]="<span style='color:red'>Please enter your user id!</span>";
errors[4]="<span style='color:red'>Please enter your password!</span>";
errors[5]="<span style='color:red'>Please confirm your password!</span>";

for (var i in inputs)
{

var errMessage=errors[i];
var div=divs[i];
if(inputs[i]=="")
document.getElementById(div).innerHTML=errMessage;

else if (i==2)
{
var atpos=inputs[i].indexOf("@");
var dotpos=inputs[i].lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=inputs[i].length)
document.getElementById('errEmail').innerHTML="<span style='color:red'>Enter a valid email address!</span>";
else
document.getElementById(div).innerHTML="OK!";
}
else if (i==5)
{
var first=document.getElementById('password').value;
var second=document.getElementById('confirm').value;

if (second!=first)
document.getElementById('errConfirm').innerHTML="<span style='color:red'>Your passwords don't match!</span>";
else
document.getElementById(div).innerHTML="OK!";
}
else
document.getElementById(div).innerHTML="OK!";
}
}

function finalValidate()
{
var count=0;

for(i=0;i<6;i++)
{
var div=divs[i];

if(document.getElementById(div).innerHTML=="OK!")
count=count+1;
}
if(count==6)
document.getElementById("errFinal").innerHTML="All the data entered is correct!!!";
}
</script>
</head>

<body>
<table id="table1">
<tr>
<td>First Name:</td>
<td><input type="text" id="first" onkeyup="validate();" required/></td>
<td><div id="errFirst"></div></td>
</tr>

<tr>
<td>Email:</td>
<td><input type="text" id="email" onkeyup="validate();" required/></td>
<td><div id="errEmail"></div></td>
</tr>

<tr>
<td>Password:</td>
<td><input type="password" id="password" onkeyup="validate();" required/></td>
<td><div id="errPassword"></div></td>
</tr>

<tr>
<td>Confirm Password:</td>
<td><input type="password" id="confirm" onkeyup="validate();" required/></td>
<td><div id="errConfirm"></div></td>
</tr>

</table>
</body>
</html>