Answered: Modify the code in a way so that after…

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

There two codes given (html and external javascript code):

HTML Code

<html>
	<head>

	<title>JavaScript registration from validation Code</title>
	<h2>Registration Form</h2>

	<script src="my-form-validation.js"></script>


	</head>
	<body onload="document.form1.userid.focus();">

	<form name='form1' onsubmit='formValidation()' >

	<table width="500" cellpadding="3" style="border-collapse: collapse;">
	<tr>
	<td>User id </td>
	<td><input type="text" name="userid" size="12" /></td>
	</tr>
	<tr>
	<td>Password</td>
	<td><input type="password" name="passid" size="12" /></td>
	</tr>
	<tr>
	<td>Name</td>
	<td><input type="text" name="username" size="50" /></td>
	</tr>
	<tr>
	<td>Address</td>
	<td><input type="text" name="address" size="50" /></td>
	</tr>
	<tr>
	<td>Country</td>
	<td><select id="country" name="country">
	<option selected="" value="PS">(Please select a country)</option>
	<option value="--">none</option>
	<option value="PK">Pakistan</option>
	<option value="KY">Kyrgyzstan</option>
	<option value="TJ">TaJkistaj</option>
	<option value="KZ">Kazakstan</option>
	<option value="AF">Afghanistan</option>

	</select></td>
	</tr>
	<tr>
	<td>ZIP Code </td>
	<td><input type="text" name="zip" /></td>
	</tr>
	<tr>
	<td>Email</td>
	<td><input type="text" name="email" size="50" /></td>
	</tr>
	<tr>
	<td>Sex</td>
	<td><input type="radio" name="msex" value="Male" /> Male
	<input type="radio" name="fsex" value="Female" /> Female</td>
	</tr>
	<tr>
	<td>Language preference</td>
	<td><input type="checkbox" name="en" value="en" checked />English
	<input type="checkbox" name="nonen" value="noen" />Non English</td>
	</tr>
	<tr>
	<td>Write about yourself<br>
	(optional)</td>
	<td><textarea name="desc" rows="4" cols="40"></textarea></td>
	</tr>
	<tr>
	<td> </td>
	<td><input type="submit" name="submit" value="Submit" /></td>
	<td> </td>
	</tr>
	</table>
	</form>
	</body>
	</html>

External JavaScript code

function formValidation()
{
var uid = document.form1.userid;
var passid = document.form1.passid;
var uname = document.form1.username;
var uadd = document.form1.address;
var ucountry = document.form1.country;
var uzip = document.form1.zip;
var uemail = document.form1.email;
var umsex = document.form1.msex;
var ufsex = document.form1.fsex;

if(userid_validation(uid,5,12))
{
if(allnumeric(uid))
{
if(userid_validation(passid,7,12))
{
if(allLetter(uname))
{
if(alphanumeric(uadd))
{
if(countryselect(ucountry))
{
if(allnumeric(uzip))
{
if(ValidateEmail(uemail))
{
if(validsex(umsex,ufsex))
{
alert('Good Luck. Your form is submitted successfully');
}
}
}
}
}
}
}
}
}
return false;
}

function userid_validation(uid,mx,my)
{
var uid_len = uid.value.length;
if (uid_len == 0 || uid_len >= my || uid_len < mx)
{
alert("This field should not be empty/length be between "+mx+" to "+my);
uid.focus();
return false;
}
return true;
}

function allLetter(uname)
{
var letters = /^[A-Za-z]+$/;
if(uname.value.match(letters))
{
return true;
}
else
{
alert('Please input alphabet characters only');
uname.focus();
return false;
}
}

function alphanumeric(uadd)
{
var letters = /^[0-9a-zA-Z]+$/;
if(uadd.value.match(letters))
{
return true;
}
else
{
alert('Please input alphanumeric characters only');
uadd.focus();
return false;
}
}

function countryselect(ucountry)
{
if(ucountry.value == "PS")
{
alert('Select your country from the list');
ucountry.focus();
return false;
}
else
{
return true;
}
}

function allnumeric(uzip)
{
var numbers = /^[0-9]+$/;
if(uzip.value.match(numbers))
{
return true;
}
else
{
alert('Please input numeric characters only');
uzip.focus();
return false;
}
}

function validsex(umsex,ufsex)
{
x=0;

if(umsex.checked)
{
x++;
}

if(ufsex.checked)
{
x++;
}
if(x==0)
{
alert('Select Male/Female');
umsex.focus();
return false;
}
else
{
return true;

}

}

Modify the code in a way so that after submitting a form there will appear a table on the screen, with all the information entered in the boxes. The table should have the structure as shown in the picture (it's an example)