UI Page
Design a web form as in the following with textboxes, labels and two buttons. It will look good if a table is used. And I even used validation controls such as required field validators for username, password , firstName, lastName and in a properties control to validate their respective TextBox names and compare the validator for a conforming passsword to compare with the password TextBox. For email, I used a regular expression validator for validating the email, phone and location.
Without entering any values if the submit button is clicked then it looks as shown in the following:
If we don't enter valid data then it looks like this:
After inserting a new record at the front end you will see the same registration details in the backend, it is inserted automatically.
Database
If the user already exists then the label becomes visible and shows the error message since the specific user already exists.
Front end
Aspx Page
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.auto-style1 {
width: 56%;
height: 220px;
}
.auto-style3 {
width: 219px;
}
.auto-style6 {
width: 128px;
}
.auto-style7 {
width: 128px;
height: 26px;
}
.auto-style8 {
width: 219px;
height: 26px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<br />
<table align="center" class="auto-style1">
<tr>
<td class="auto-style7">
<asp:Label ID="Label1" runat="server" Text="UserName"></asp:Label>
</td>
<td class="auto-style8">
<asp:TextBox ID="ut" runat="server" ValidationGroup="Requried" Width="192px"></asp:TextBox>
</td>
<td class="auto-style8">
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="ut" ErrorMessage="Please enter a user name" ForeColor="Red" SetFocusOnError="True"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="auto-style6">
<asp:Label ID="Label2" runat="server" Text="Password"></asp:Label>
</td>
<td class="auto-style3">
<asp:TextBox ID="pt" runat="server" TextMode="Password" Width="192px"></asp:TextBox>
</td>
<td class="auto-style3">
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="Pt" ErrorMessage="Please enter a password" ForeColor="Red"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="auto-style6">
<asp:Label ID="Label9" runat="server" Text="Conform Password"></asp:Label>
</td>
<td class="auto-style3">
<asp:TextBox ID="cnfpt" runat="server" TextMode="Password" Width="192px"></asp:TextBox>
</td>
<td class="auto-style3">
<asp:CompareValidator ID="CompareValidator1" runat="server" ControlToCompare="cnfpt" ControlToValidate="Pt" ErrorMessage="Password Mismatch" ForeColor="Red"></asp:CompareValidator>
</td>
</tr>
<tr>
<td class="auto-style6">
<asp:Label ID="Label4" runat="server" Text="FirstName"></asp:Label>
</td>
<td class="auto-style3">
<asp:TextBox ID="ft" runat="server" Width="192px"></asp:TextBox>
</td>
<td class="auto-style3">
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="ft" ErrorMessage="Please enter a first name" ForeColor="Red"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="auto-style6">
<asp:Label ID="Label5" runat="server" Text="LastName"></asp:Label>
</td>
<td class="auto-style3">
<asp:TextBox ID="lt" runat="server" Width="192px"></asp:TextBox>
</td>
<td class="auto-style3">
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="lt" ErrorMessage="Please enter a last name" ForeColor="Red"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="auto-style6">
<asp:Label ID="Label6" runat="server" Text="Email"></asp:Label>
</td>
<td class="auto-style3">
<asp:TextBox ID="et" runat="server" Width="192px"></asp:TextBox>
</td>
<td class="auto-style3">
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="et" ErrorMessage="Enter valid email address" ForeColor="Red" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td class="auto-style6">
<asp:Label ID="Label7" runat="server" Text="Phone:"></asp:Label>
</td>
<td class="auto-style3">
<asp:TextBox ID="pnt" runat="server" Width="192px"></asp:TextBox>
</td>
<td class="auto-style3">
<asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ControlToValidate="pnt" ErrorMessage="Enter a valid US phone number" ForeColor="Red" ValidationExpression="((\(\d{3}\) ?)|(\d{3}-))?\d{3}-\d{4}" Width="230px"></asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td class="auto-style7">
<asp:Label ID="Label8" runat="server" Text="Location"></asp:Label>
</td>
<td class="auto-style8">
<asp:TextBox ID="loct" runat="server" Width="192px"></asp:TextBox>
</td>
<td class="auto-style8">
<asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" ControlToValidate="loct" ErrorMessage="Enter Correct Zip Code" ForeColor="Red" ValidationExpression="\d{5}(-\d{4})?" Width="230px"></asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td class="auto-style6"> </td>
<td class="auto-style3">&
<br />
<asp:Button ID="Button2" runat="server" Text="Submit" OnClick="Button2_Click" />// submit button
<asp:Button ID="Button3" runat="server" Text="Reset" OnClick="Button3_Click" />// Reset Button
</td>
<td class="auto-style3"> </td>
</tr>
</table>
<br />
<asp:Label ID="lblErrorMsg" runat="server" Text="lblErrorMsg" Visible="False"></asp:Label>
</form>
</body>
</html>
Aspx.cs
using System;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Data.SqlClient;
namespace WebApplication1
{
public partial class WebForm1 : System.Web.UI.Page
{
private string message = string.Empty;
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button2_Click(object sender, EventArgs e) // submit button
{
if (pt.Text == cnfpt.Text)
{
string username = ut.Text;
string password = pt.Text;
string confirmpassword = cnfpt.Text;
string firstname = ft.Text;
string lastname = lt.Text;
string emailaddress = et.Text;
string phone = pnt.Text;
string location = loct.Text;
string createdby = ut.Text;
SqlConnection con = new SqlConnection("Data Source=.;Initial Catalog=RAJU;Integrated Security=True");
con.Open();
SqlCommand cmd = new SqlCommand("sp_userinformation", con);
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@UserName", username);
cmd.Parameters.AddWithValue("@Password", password);
cmd.Parameters.AddWithValue("@FirstName", firstname);
cmd.Parameters.AddWithValue("@LastName", lastname);
cmd.Parameters.AddWithValue("@Email", emailaddress);
cmd.Parameters.AddWithValue("@PhoneNo", phone);
cmd.Parameters.AddWithValue("@Location", location);
cmd.Parameters.AddWithValue("@Created_By", createdby);
cmd.Parameters.Add("@ERROR", SqlDbType.Char, 500);
cmd.Parameters["@ERROR"].Direction = ParameterDirection.Output;
cmd.ExecuteNonQuery();
message = (string)cmd.Parameters["@ERROR"].Value;
con.Close();
}
else
{
Page.RegisterStartupScript("UserMsg", "<Script language='javascript'>alert('" + "Password mismatch" + "');</script>");
}
lblErrorMsg.Text = message; // if only user exits already in database then it shows errorlabel as already existed..... initially the label visible was set to false.....
lblErrorMsg.Visible = true;
}
protected void Button3_Click(object sender, EventArgs e)// reset button
{
ut.Text = "";
ft.Text = "";
lt.Text = "";
et.Text = "";
loct.Text ="";
pnt.Text ="";
}
}
}
Backend
First create a User Table in the following format:
Create a Stored Procedure sp_userinfo for inserting values. If the user doesn't exist , else the user exists in other words it must raise an error message. Here I used an output parameter for showing the error:
Create PROCEDURE [dbo].[sp_userinfo]
@UserName varchar(50),
@Password varchar(50),
@FirstName varchar(50),
@LastName varchar(50),
@Email varchar(50),
@PhoneNo varchar(50),
@Location varchar(50),
@Created_By varchar(50),
@ERROR VARCHAR(100) OUT
AS
BEGIN
-- SET NOCOUNT ON added to prevent extra result sets from
-- interfering with SELECT statements.
SET NOCOUNT ON;
---Checking Condition if User exists or not if user not exists returns different message if exists returns different message
IF NOT EXISTS(SELECT * FROM User WHERE UserName=@UserName)
BEGIN
INSERT INTO User
(
UserName,
[Password],
FirstName,
LastName,
Email,
PhoneNo,
Location,
Created_By
)
VALUES
(
@UserName,
@Password,
@FirstName,
@LastName,
@Email,
@PhoneNo,
@Location,
@Created_By
)
--If User Successfully Registerd I am returing this Message as Output Parameter
SET @ERROR=@UserName+' Registered Successfully'
END
ELSE
BEGIN
--If User already Exists i am returning this Message as Output Parameter
SET @ERROR=@UserName + ' Already Exists'
END
END