Question

In: Computer Science

The main content of the page will be a form, containing the elements listed below. For...

  • The main content of the page will be a form, containing the elements listed below.
  • For each element of the form (except the <form> itself and any <button>s), there should be some text preceding the element explaining what the user should enter or select in that element.
  • The form should use the POST method, and the action should be the same php file, so the same php file that generated the form also validates the form.
  • The form should have at least four text input elements (input type="text"). Two of these input fields should ask the user to enter the same value (for example, "Enter your e-mail" and "Enter your e-mail again").
  • There should be one form element that is for password input (input type="password”)
  • There should be two sets of radio buttons, with at least 3 radio buttons for each set (input type="radio”). Hint: Radio buttons belong to the same set if they have the same name attribute.
  • There should be some checkboxes (input type="checkbox”)
  • The form should have a drop-down list (select). This list should have at least 5 options, with one option being set as the default.
  • The form should have a multi-line input field (textarea)
  • There should be one button, an input element with type="button”. This button should call the javascript function checkSimilarity().
  • There should be one button, using the button element. Note that the previous button uses the tag <input type="button"...>, while this button uses the tag <button …>. This button should call the javascript function validate().
  • The form should have a submit button (input element with type="submit”)

Javascript Requirements

  • Create a function called checkSimilarity(), which checks to see if the text entered in the two text entry elements that should have identical values are indeed identical. If they are the same, display an alert box saying “The inputs are the same”, and if not, display “The inputs are not the same”.
  • Create a function called validate(), which checks if
    • Text has been entered in every text box
    • At least one radio button has been selected for each set
    • At least one checkbox has been checked

Display an alert box stating which field has not been completed

Solutions

Expert Solution

Download Source Code: https://www.roseindia.net/tutorialfiles/48739.studentregistrationformexample.zip

StudentRegistration.html

<html>
<head>
<script type="text/javascript" src="validate.js"></script>
</head>
<body>
<form action="#" name="StudentRegistration" onsubmit="return(validate());">

<table cellpadding="2" width="20%" bgcolor="99FFFF" align="center"
cellspacing="2">

<tr>
<td colspan=2>
<center><font size=4><b>Student Registration Form</b></font></center>
</td>
</tr>

<tr>
<td>Name</td>
<td><input type=text name=textnames id="textname" size="30"></td>
</tr>

<tr>
<td>Father Name</td>
<td><input type="text" name="fathername" id="fathername"
size="30"></td>
</tr>
<tr>
<td>Postal Address</td>
<td><input type="text" name="paddress" id="paddress" size="30"></td>
</tr>

<tr>
<td>Personal Address</td>
<td><input type="text" name="personaladdress"
id="personaladdress" size="30"></td>
</tr>

<tr>
<td>Sex</td>
<td><input type="radio" name="sex" value="male" size="10">Male
<input type="radio" name="sex" value="Female" size="10">Female</td>
</tr>

<tr>
<td>City</td>
<td><select name="City">
<option value="-1" selected>select..</option>
<option value="New Delhi">NEW DELHI</option>
<option value="Mumbai">MUMBAI</option>
<option value="Goa">GOA</option>
<option value="Patna">PATNA</option>
</select></td>
</tr>

<tr>
<td>Course</td>
<td><select name="Course">
<option value="-1" selected>select..</option>
<option value="B.Tech">B.TECH</option>
<option value="MCA">MCA</option>
<option value="MBA">MBA</option>
<option value="BCA">BCA</option>
</select></td>
</tr>

<tr>
<td>District</td>
<td><select name="District">
<option value="-1" selected>select..</option>
<option value="Nalanda">NALANDA</option>
<option value="UP">UP</option>
<option value="Goa">GOA</option>
<option value="Patna">PATNA</option>
</select></td>

</tr>

<tr>
<td>State</td>
<td><select Name="State">
<option value="-1" selected>select..</option>
<option value="New Delhi">NEW DELHI</option>
<option value="Mumbai">MUMBAI</option>
<option value="Goa">GOA</option>
<option value="Bihar">BIHAR</option>
</select></td>
</tr>
<tr>
<td>PinCode</td>
<td><input type="text" name="pincode" id="pincode" size="30"></td>

</tr>
<tr>
<td>EmailId</td>
<td><input type="text" name="emailid" id="emailid" size="30"></td>
</tr>

<tr>
<td>DOB</td>
<td><input type="text" name="dob" id="dob" size="30"></td>
</tr>

<tr>
<td>MobileNo</td>
<td><input type="text" name="mobileno" id="mobileno" size="30"></td>
</tr>
<tr>
<td><input type="reset"></td>
<td colspan="2"><input type="submit" value="Submit Form" /></td>
</tr>
</table>
</form>
</body>
</html>

Form Validation

function validate()
{ 
   if( document.StudentRegistration.textnames.value == "" )
   {
     alert( "Please provide your Name!" );
     document.StudentRegistration.textnames.focus() ;
     return false;
   }
   if( document.StudentRegistration.fathername.value == "" )
   {
     alert( "Please provide your Father Name!" );
     document.StudentRegistration.fathername.focus() ;
     return false;
   }
   
   if( document.StudentRegistration.paddress.value == "" )
   {
     alert( "Please provide your Postal Address!" );
     document.StudentRegistration.paddress.focus() ;
     return false;
   }
   if( document.StudentRegistration.personaladdress.value == "" )
   {
     alert( "Please provide your Personal Address!" );
     document.StudentRegistration.personaladdress.focus() ;
     return false;
   }
   if ( ( StudentRegistration.sex[0].checked == false ) && ( StudentRegistration.sex[1].checked == false ) )
   {
   alert ( "Please choose your Gender: Male or Female" );
   return false;
   }   
   if( document.StudentRegistration.City.value == "-1" )
   {
     alert( "Please provide your City!" );
     document.StudentRegistration.City.focus() ;
     return false;
   }   
   if( document.StudentRegistration.Course.value == "-1" )
   {
     alert( "Please provide your Course!" );
    
     return false;
   }   
   if( document.StudentRegistration.District.value == "-1" )
   {
     alert( "Please provide your Select District!" );
    
     return false;
   }   
   if( document.StudentRegistration.State.value == "-1" )
   {
     alert( "Please provide your Select State!" );
     
     return false;
   }
   if( document.StudentRegistration.pincode.value == "" ||
           isNaN( document.StudentRegistration.pincode.value) ||
           document.StudentRegistration.pincode.value.length != 6 )
   {
     alert( "Please provide a pincode in the format ######." );
     document.StudentRegistration.pincode.focus() ;
     return false;
   }
 var email = document.StudentRegistration.emailid.value;
  atpos = email.indexOf("@");
  dotpos = email.lastIndexOf(".");
 if (email == "" || atpos < 1 || ( dotpos - atpos < 2 )) 
 {
     alert("Please enter correct email ID")
     document.StudentRegistration.emailid.focus() ;
     return false;
 }
  if( document.StudentRegistration.dob.value == "" )
   {
     alert( "Please provide your DOB!" );
     document.StudentRegistration.dob.focus() ;
     return false;
   }
  if( document.StudentRegistration.mobileno.value == "" ||
           isNaN( document.StudentRegistration.mobileno.value) ||
           document.StudentRegistration.mobileno.value.length != 10 )
   {
     alert( "Please provide a Mobile No in the format 123." );
     document.StudentRegistration.mobileno.focus() ;
     return false;
   }
   return( true );
}

OUTPUT

venereology answered 2 years ago
Next > < Previous

Related Solutions

Listed below is the sodium content in milligrams (mg) for 5 of Wendy’s burgers. This data...
Listed below is the sodium content in milligrams (mg) for 5 of Wendy’s burgers. This data was obtained from their web site. Determine the confidence interval for the true standard deviation of sodium content at the 95% level of confidence. Assume the data are independent random samples and are normally distributed. The answers are in milligrams. 1540     1250     1230     1400     1440
Which form of the compound below will predominate at the pH's listed below: CH3COOH (pKa =...
Which form of the compound below will predominate at the pH's listed below: CH3COOH (pKa = 4.8)    or CH3COO- or CH3COOH2+ pH=14 pH=10 pH=3 pH=6 Which form of the compound below will predominate at the pH's listed below: CH3CH2NH3+ (pKa = 11.0) or CH3CH2NH2 or   CH3CH2NH- pH=6 pH=14 pH=3 pH=10 Which form of the compound below will predominate at the pH's listed below: CF3CH2OH (pKa = 12.4)   or CF3CH2OH2+   or   CF3CH2O- pH=10 pH=3 pH=6 pH=14
For each pair of elements and compounds listed below, discuss their similarities and/or differences in terms...
For each pair of elements and compounds listed below, discuss their similarities and/or differences in terms of physical and chemical properties. (a) Boron (B) and silicon (Si) (b) BeCl2 and MgCl2; (c) Al2O3 and In2O3;
Listed below are items that may or may not require the filing of an SEC form....
Listed below are items that may or may not require the filing of an SEC form. For each item ibelow, select the appropriate form from the list provided. A selection may be used once, more than once, or not at all. There is a change in beneficial ownership. There is a change in control of the company. The annual report providing a comprehensive overview of a company's business and financial condition. A brief notice that provides information about a company...
GENERAL INSTRUCTIONS FOR JANUARY 1) Journalize the transactions listed below and on the next page and...
GENERAL INSTRUCTIONS FOR JANUARY 1) Journalize the transactions listed below and on the next page and post to the ledger accounts. Omit explanations. 2) Prepare an unadjusted trial balance. 3) Journalize the adjusting entries and post to the general ledger. Adjustment data are provided on the next page. 4) Prepare an adjusted trial balance. 5) Prepare a schedule of accounts receivable. List the balance of each customer account with a balance and total the balances. Compare the total to the...
Decide whether each pair of elements in the table below will form an ionic compound.
Decide whether each pair of elements in the table below will form an ionic compound. If they will write the empirical formula and name of the compound formed in the spaces provided.
Decide whether each pair of elements in the table below will form an ionic compound. If...
Decide whether each pair of elements in the table below will form an ionic compound. If they will, write the empirical formula and name of the compound formed in the spaces provided. element #1 element #2 Forms ionic compound? empirical formula of ionic compound name of ionic compound sodium iodine yes no barium oxygen yes no chlorine oxygen yes no oxygen rubidium yes no
Decide whether each pair of elements in the table below will form an ionic compound.
Decide whether each pair of elements in the table below will form an ionic compound. If they will, write the empirical formula and name of the compound formed in the spaces provided. 
Kindly write a one page summary of the content below including important details. Thank you. Abstract...
Kindly write a one page summary of the content below including important details. Thank you. Abstract Representing the 60 trillion cells that build a human body, a sperm and an egg meet, recognize each other, and fuse to form a new generation of life. The factors involved in this important membrane fusion event, fertilization, have been sought for a long time. Recently, CD9 on the egg membrane was found to be essential for fusion [1], but sperm-related fusion factors remain...
Kindly write a two page summary of the content below including important details. Thank you. kindly...
Kindly write a two page summary of the content below including important details. Thank you. kindly paraphrase as well Abstract Representing the 60 trillion cells that build a human body, a sperm and an egg meet, recognize each other, and fuse to form a new generation of life. The factors involved in this important membrane fusion event, fertilization, have been sought for a long time. Recently, CD9 on the egg membrane was found to be essential for fusion [1], but...
ADVERTISEMENT
Subjects
ADVERTISEMENT
Latest Questions
ADVERTISEMENT