HTML

Admission Form in HTML

This article describes how to create an Admission Form in HTML.

The following code shows the example of an HTML Form that we can use for Admission for a course. Basically, an HTML form allows user to provide their input to a website. In other words, an HTML form displays various input controls so that the user can enter some values. Also, it contains a submit button. When user clicks on the submit button, the form is sent to the server for processing.

The following example displays the <form tag. Since, it is a basic example of using the form tag, here we have used just one attribute called method. Basically, the value POST indicates that the form will use the POST method to securely send form data to the server. Another method is the GET method. Apart rom the method attribute, the <form> tag also has a name attribute that identifies the form and the action attribute represents the file that will be processed when user submits the form.

Furthermore, the form element encloses the input elements that specifies certain kind of input control. For instance, we can use the textbox, checkboxes, radio buttons, drop down lists and so on. the input tag has an attribute called type. Some of the possible values of the type attribute are text, checkbox, radio, file, date, number, and email. In order to display a drop-down list, we use the select tag. The option tag within the select tag represents the list items.

Also, note the use of the <fieldset> and <legend> tag. Basically, the fieldset tag groups the controls of the form. Whereas, the legend provides a title to the group.

The Complete Code for Admission Form in HTML

<html>
  <head>
     <title>Admission Form</title>
  </head>
  <body>
     <center><h1>Admission Form</h1></center>
     <div style="margin: 50px;padding: 10px; text-align: center;">
     <form method="POST">
       <fieldset>
         <legend>Login Details</legend>
         <table>
             <tr>
                <td>Username: </td>
                <td><input type="text" name="t1"/></td>
             </tr>
             <tr>
                <td>Password: </td>
                <td><input type="password" name="t2"/></td>
             </tr>  
         </table>
       </fieldset>
       <fieldset>
         <legend>Personal Details</legend>
         <table>
            <tr>
		<td>Name: </td>
		<td><input type="text" name="t3"/></td>
            </tr>
            <tr>
		<td>Mother's Name</td>
		<td><input type="text" name="t4"/></td>
	    </tr>
            <tr>
		<td>Father's Name</td>
		<td><input type="text" name="t5"/></td>
	    </tr>
            <tr>
		<td>Date of Birth</td>
		<td><input type="date" name="t6"/></td>
	    </tr>
            <tr>
		<td>Gender</td>
		<td>
		    <input type="radio" name="r1" value="male">Male</input>
		    <input type="radio" name="r1" vale="female">Female</input>
                </td>
	    </tr>
         </table> 
       </fieldset>
        <fieldset>
         <legend>Contact Details</legend>
          <table>
            <tr>
		<td>Contact Number: </td>
		<td><input type="tel" name="t7"/></td>
            </tr>
            <tr>
		<td>Email ID: </td>
		<td><input type="email" name="t8"/></td>
            </tr>
            <tr>
		<td>Address</td>
		<td><textarea rows="5" cols="30">Enter Address...</textarea></td>
            </tr>
            <tr>
		<td>Country: </td>
		<td>
                   <select name="country">
			<option>India</option>
			<option>USA</option>
			<option>UK</option>
			<option>Australia</option>
                   </select>
                </td>
            </tr>
          </table>

       </fieldset> 
       <fieldset>
         <legend>Academic Details</legend>
         <table>
           <tr>
             <td>10<sup>th</sup> Class Marks:</td>
             <td><input type="number" name="t9"/></td>
             <td>Board: </td>
             <td><input type="text" name="t9_1"/></td>
             <td>School Name: </td>
             <td><input type="text" name="t9_2"/></td>
           </tr>
           <tr>
           <tr>
             <td>12<sup>th</sup> Class Marks:</td>
             <td><input type="number" name="t10"/></td>
             <td>Board: </td>
             <td><input type="text" name="t10_1"/></td>
             <td>School Name: </td>
             <td><input type="text" name="t10_2"/></td>
           </tr>
           </tr>
         </table>
       </fieldset>  
       <div style="margin-top: 20px; padding: 10px;text-align: center;">
           <Button onclick="alert('Form Submitted');">Submit</button>
       </div>  
     </form>
     </div>
  </body>
</html>

Output

Example of an Admission Form in HTML
Example of an Admission Form in HTML

Further Reading

Introduction to Django Framework and its Features

Django Practice Exercise

Installing Django on Windows

Examples of Array Functions in PHP

Basic Programs in PHP

Registration Form Using PDO in PHP

Inserting Information from Multiple CheckBox Selection in a Database Table in PHP

programmingempire

princites.com

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *