Creating User Registration Form

After studying web server controls now let's create a user registration form. This web form takes user input and submits to the server. After submitting, it return message of successfully registered. This whole process takes the following steps.

Add a Web Form to the project

This form contains some default html code.

Adding Controls to the form

To add controls to the form either we can drag components from the toolbox or write code manually to create the components.

The following file contains the code for a user registration form.

// WebControls.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebControls.aspx.cs" 
Inherits="WebFormsControlls.WebControls" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.auto-style1 {
     width: 100%;
      }
.auto-style2 {
     width: 278px;
       }
.auto-style3 {
      width: 278px;
      height: 23px;
        }
.auto-style4 {
      height: 23px;
        }
</style>
</head>
<body>
<form id="form1" runat="server">
<div>         
  <table class="auto-style1">
    <tr>
    <td>
    <asp:Label ID="Label1" runat="server" Text="User Name"></asp:Label>
    </td>
    <td>
    <asp:TextBox ID="username" runat="server" required="true"></asp:TextBox></td>
    </tr>
    <tr>
    <td>
    <asp:Label ID="Label6" runat="server" Text="Email ID"></asp:Label>
    </td>
    <td>
    <asp:TextBox ID="EmailID" runat="server" TextMode="Email"></asp:TextBox></td>
    </tr>
    <tr>
    <td>
    <asp:Label ID="Label2" runat="server" Text="Password"></asp:Label></td>
    <td>
    <asp:TextBox ID="TextBox2" runat="server" TextMode="Password"></asp:TextBox></td>
    </tr>
    <tr>
    <td>
    <asp:Label ID="Label3" runat="server" Text="Confirm Password"></asp:Label></td>
    <td>
    <asp:TextBox ID="TextBox3" runat="server" TextMode="Password"></asp:TextBox></td>
    </tr>
    <tr>
    <td>
    <asp:Label ID="Label4" runat="server" Text="Gender"></asp:Label></td>
    <td>
    <asp:RadioButton ID="RadioButton1" runat="server" GroupName="gender" Text="Male" />
	<asp:RadioButton ID="RadioButton2" runat="server" GroupName="gender" Text="Female" /></td>
    </tr>
    <tr>
    <td>
    <asp:Label ID="Label5" runat="server" Text="Select Course"></asp:Label>s</td>
    <td>
    <asp:CheckBox ID="CheckBox1" runat="server" Text="J2SEE" />
	<asp:CheckBox ID="CheckBox2" runat="server" Text="J2EE" />
	<asp:CheckBox ID="CheckBox3" runat="server" Text="Spring Framework" />
    </td>
    </tr>
    <tr>
    <td>
    </td>
    <td>
    <br />
    <asp:Button ID="Button1" runat="server" Text="Register" CssClass="btn btn-primary" OnClick="Button1_Click"/>
    </td>
    </tr>
    </table>
    <asp:Label ID="message" runat="server" Font-Size="Medium" ForeColor="Red"></asp:Label>
    </div>
    </form>
    <table class="auto-style1">
    <tr>
    <td class="auto-style2"><asp:Label ID="ShowUserNameLabel" runat="server" ></asp:Label></td>
    <td>
    <asp:Label ID="ShowUserName" runat="server" ></asp:Label></td>
    </tr>
    <tr>
    <td class="auto-style2"><asp:Label ID="ShowEmailIDLabel" runat="server" ></asp:Label></td>
    <td>
    <asp:Label ID="ShowEmail" runat="server" ></asp:Label></td>
    </tr>
    <tr>
    <td class="auto-style3"><asp:Label ID="ShowGenderLabel" runat="server" ></asp:Label></td>
    <td class="auto-style4">
    <asp:Label ID="ShowGender" runat="server" ></asp:Label></td>
    </tr>
    <tr>
    <td class="auto-style2"><asp:Label ID="ShowCourseLabel" runat="server" ></asp:Label></td>
    <td>
    <asp:Label ID="ShowCourses" runat="server" ></asp:Label></td>
    </tr>
    </table>
</body>
</html>

Handling Submit Request

In code behind file, we are adding a message that trigger only when user submit the registration form. This file includes the following code.

// WebControls.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebFormsControlls
{
    public partial class WebControls : System.Web.UI.Page
    {
        protected System.Web.UI.HtmlControls.HtmlInputFile File1;
        protected System.Web.UI.HtmlControls.HtmlInputButton Submit1;
        protected void Page_Load(object sender, EventArgs e)
        {
        }
        protected void Button1_Click(object sender, EventArgs e)
        {
            message.Text      = "Hello " + username.Text + " ! ";
            message.Text      = message.Text + " <br/> You have successfuly Registered with the following details.";
            ShowUserName.Text = username.Text;
            ShowEmail.Text    = EmailID.Text;
            if (RadioButton1.Checked)
            {
                ShowGender.Text = RadioButton1.Text;
            }
            else ShowGender.Text = RadioButton2.Text;
        var courses = "";
            if (CheckBox1.Checked)
            {
                courses = CheckBox1.Text + " ";
            }
            if (CheckBox2.Checked)
            {
                courses += CheckBox2.Text + " ";
            }   
            if (CheckBox3.Checked)
            {
                courses += CheckBox3.Text;
            }
            ShowCourses.Text = courses;
            ShowUserNameLabel.Text = "User Name";
            ShowEmailIDLabel.Text = "Email ID";
            ShowGenderLabel.Text = "Gender";
            ShowCourseLabel.Text = "Courses";
            username.Text = "";
            EmailID.Text = "";
            RadioButton1.Checked = false;
            RadioButton2.Checked = false;
            CheckBox1.Checked = false;
            CheckBox2.Checked = false;
            CheckBox3.Checked = false;
        }
    }
}

Run User Registration Form

To run this form, just right click and select view in browser option. We did it in our example.

Output:

And it produces the following output.

After filling the form and registration, it shows a greeting message to the user.

After submit the registration details.

Next TopicASP.NET WF Events Handling

← prev next →

For Videos Join Our Youtube Channel: Join Now

Feedback

Send your Feedback to [email protected]

Help Others, Please Share

Learn Latest Tutorials

Splunk

SPSS

Swagger

Transact-SQL

Tumblr

ReactJS

Regex

Reinforcement Learning

R Programming

RxJS

React Native

Python Design Patterns

Python Pillow

Python Turtle

Keras

Preparation

Aptitude

Reasoning

Verbal Ability

Interview Questions

Company Questions

Trending Technologies

Artificial Intelligence

AWS

Selenium

Cloud Computing

Hadoop

ReactJS

Data Science

Angular 7

Blockchain

Git

Machine Learning

DevOps

B.Tech / MCA

DBMS

Data Structures

DAA

Operating System

Computer Network

Compiler Design

Computer Organization

Discrete Mathematics

Ethical Hacking

Computer Graphics

Software Engineering

Web Technology

Cyber Security

Automata

C Programming

C++

Java

.Net

Python

Programs

Control System

Data Mining

Data Warehouse

Javatpoint Services

JavaTpoint offers too many high quality services. Mail us on h[email protected], to get more information about given services.

Website Designing
Website Development
Java Development
PHP Development
WordPress
Graphic Designing
Logo
Digital Marketing
On Page and Off Page SEO
PPC
Content Development
Corporate Training
Classroom and Online Training
Data Entry

Training For College Campus

JavaTpoint offers college campus training on Core Java, Advance Java, .Net, Android, Hadoop, PHP, Web Technology and Python. Please mail your requirement at [email protected].
Duration: 1 week to 2 week

^{Like/Subscribe us for latest updates or newsletter}