Sunday, December 24, 2017

How To Create Basic Registration Form In Html

Hello Friends My Name Is Viraj,Today I Will Create Basic Registration Form On Your Web Page.I am new to CSS and HTML, I want to try and create a registration form where i have a user enter details then submit to a database or if user click on reset it resets the fields. At present, the concept of online student registration form has emerged as a great relief for the educational institutes across the world as it saves the time for both the students as well as management. In addition to that, it reduces risk of loosing data, which was a great concern with manual registration forms.In this tutorial you will learn to create a student registration form using html code in easy steps. In this example given below, you will find several text fields required to fill in a student registration form, radio button, Reset button and Submit Form button. The Reset button will reset the form to blank.In this tutorial for writing html code for student registration form JavaScript validation has been used. Moreover, if you do not enter any value in the text fields, an error message will appear. In this student registration form, filling up every field is mandatory and will show an error message if any field is left blank. Further changes can be made as per the requirements by the programmer. Once all the fields are filled correctly, submit form adds the data.In this tutorial we are going to create two HTML5 forms that will switch between login and registration using the CSS3 pseudo class :target. We will style it using CSS3 and an icon font. The idea behind this demo is to show the user the login form and provide a link to “switch” to the registration form.HTML Forms are required, when you want to collect some data from the site visitor. For example, during user registration you would like to collect information such as name, email address, credit card, etc.A form will take input from the site visitor and then will post it to a back-end application such as CGI, ASP Script or PHP script etc. The back-end application will perform required processing on the passed data based on defined business logic inside the application.Creating a membership based site seems like a daunting task at first. If you ever wanted to do this by yourself, then just gave up when you started to think how you are going to put it together using your PHP skills, then this article is for you. We are going to walk you through every aspect of creating a membership based site, with a secure members area protected by password.

The whole process consists of two big parts: user registration and user authentication. In the first part, we are going to cover creation of the registration form and storing the data in a MySQL database. In the second part, we will create the login form and use it to allow users access in the secure area.There are various form elements available like text fields, textarea fields, drop-down menus, radio buttons, checkboxes, etc.Here In This Html Tutorial We Will Create Basic Registration Form In Html.Here In This Blog We Will Use All Type Of Html Tag To Create Registration Form In Html.Here Is An Example Related To Blog.

So Let Begin With Our Coding............

Step 1:

<!DOCTYPE html>
<html>
<head>
<title>Registration Form</title>
</head>
<body bgcolor="lightgrey">
<h2 align="center">On-Line Registration Form</h2>
<hr width="100%" size="2" color="red">
<br>
First Name:<input title="first name" type="text" size="30" name="f1">&nbsp;&nbsp;&nbsp;&nbsp;
Middle Name:<input title="middle name" type="text" size="30" name="m1">&nbsp;&nbsp;&nbsp;&nbsp; 
Last Name:<input title="last name" type="text" size="30" name="l1">&nbsp;&nbsp;&nbsp;&nbsp;
<br><br>
Type Your Address:<br>
<textarea row="5" cols="50">
</textarea>
<fieldset>
<legend align="center">
<b><i>Personal Details:-</b></i>
</legend>
<br><br>
Select Gender:<input type="radio" name="male">Male
              <input type="radio" name="male">Female
<br><br>
Select Date of Birth:&nbsp;
<select>
<option>--Days--</option>
<option>01</option><option>02</option><option>03</option></select>(dd)

<select>
<option>--Months--</option>
<option>January</option><option>February</option><option>March</option></select>(mm)

<select>
<option>--Years--</option>
<option>1950</option><option>1951</option><option>1952</option></select>(yy)
<br><br>

Castes:<input type="radio" name="other">Other
       <input type="radio" name="other">OBC/SBC
       <input type="radio" name="other">SC
       <input type="radio" name="other">ST
       <input type="radio" name="other">Open
       <input type="radio" name="other">NT
<br><br>

Select Education:<input type="checkbox" name="ssc">S.S.C
                 <br><br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="hsc">H.S.C
                 <br><br>

Mobile No:<select>
<option>+91</option><option>+92</option></select>
<input title="Mobile No." type="text" size="30">
<br><br>

Tel No:<input title="Tel No" type="text" size="30">
</fieldset>
<br><br>

File Upload:
<input type="file" name="upload">
<br><br>

<input type="button" value="Submit" name="submit">

<input type="button" value="Reset" name="submit">

</body>
</html>


Output :


4 comments:

How To Create Image Gallery In Html

Hello Friend My Name Is Viraj,Today I Will Create Image Gallery And Display On A Webpage.The emergence of CSS3 technology has enabled web d...