How to Make a Registration Form With Validation in ASP.Net

INITIAL CHAMBER

 
Step 1
Open your Visual Studio 2010. Create an Empty Website under Visual C#. Provide a suitable name to your application such as "validation_demo".
 
Step 2
In Solution Explorer right-click the project and select Add New Item (or use Ctrl + Shift + A) the select Web Form (validation_demo.aspx). Again get back to Add New Item then select SQL Server Database. (Put your database inside App_Data_Folder).
 
Step 3
I think everyone has installed the Ajaxtoolkit inside the Toolbox in VS10. If not then go to my tutorial “How to add AjaxToolkit in VS10” and add it, we need that later.
 

DATABASE CHAMBER

 
Step 4
In Server Explorer, under your database (Database.mdf) do something to table then select Add New Table.
 
Table -> tbl_data
Don't forget to set Is Identity == True for “ID”.
 
 
Figure 1 Database
 
Step 5
Create a Stored Procedure by going to Database.mdf -> Stored Procedure -> Add New Stored Procedure.
 
Stored Procedure – sp_insert:
 
 
Figure 2 Stored Procedure
 

DESIGN CHAMBER

 
Step 6
Now get back to your validation.aspx page, where we will design our application. Here is the design code:
 
Validation.aspx
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>  
  2. <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  4. <html xmlns="http://www.w3.org/1999/xhtml">  
  5.   
  6.     <head runat="server">  
  7.         <title></title>  
  8.         <style type="text/css">  
  9.         .style1 {  
  10.             width: 122px;  
  11.         }  
  12.   
  13.         .style2 {  
  14.             width: 239px;  
  15.         }  
  16.   
  17.         .style3 {  
  18.             text-align: left;  
  19.             text-decoration: underline;  
  20.             font-family: Arial, Helvetica, sans-serif;  
  21.             font-size: large;  
  22.         }  
  23.         </style>  
  24.     </head>  
  25.   
  26.     <body>  
  27.         <form id="form1" runat="server">  
  28.             <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>  
  29.             <div>  
  30.                 <table style="width:100%;">  
  31.                     <caption class="style3">  
  32.                         <strong>Registration Form with Validation</strong>  
  33.                     </caption>  
  34.                     <tr>  
  35.                         <td class="style1">  
  36.                         </td>  
  37.                         <td class="style2">  
  38.                         </td>  
  39.                         <td>  
  40.                         </td>  
  41.                     </tr>  
  42.                     <tr>  
  43.                         <td class="style1">  
  44.                             <asp:Label ID="Label1" runat="server" Text="FirstName:"></asp:Label>  
  45.                         </td>  
  46.                         <td class="style2">  
  47.                             <asp:TextBox ID="TextBox1" runat="server" Height="22px" MaxLength="20" Width="158px"></asp:TextBox>  
  48.                         </td>  
  49.                         <td>  
  50.                             <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="TextBox1" ErrorMessage="Please Enter your First Name" ForeColor="#CC0000"></asp:RequiredFieldValidator>  
  51.                         </td>  
  52.                         <td>  
  53.                             <asp:FilteredTextBoxExtender ID="FilteredTextBoxExtender1" TargetControlID="TextBox1" FilterType="LowercaseLetters,UppercaseLetters,Custom" runat="server"></asp:FilteredTextBoxExtender>  
  54.                         </td>  
  55.                     </tr>  
  56.                     <tr>  
  57.                         <td class="style1">  
  58.                             <asp:Label ID="Label2" runat="server" Text="LastName:"></asp:Label>  
  59.                         </td>  
  60.                         <td class="style2">  
  61.                             <asp:TextBox ID="TextBox2" runat="server" Height="22px" MaxLength="10" Width="158px"></asp:TextBox>  
  62.                         </td>  
  63.                         <td>  
  64.                             <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="TextBox2" ErrorMessage="Please Enter your Last Name" ForeColor="#CC0000"></asp:RequiredFieldValidator>  
  65.                         </td>  
  66.                         <td>  
  67.                             <asp:FilteredTextBoxExtender ID="FilteredTextBoxExtender2" TargetControlID="TextBox2" FilterType="LowercaseLetters,UppercaseLetters,Custom" runat="server"></asp:FilteredTextBoxExtender>  
  68.                         </td>  
  69.                     </tr>  
  70.                     <tr>  
  71.                         <td class="style1">  
  72.                             <asp:Label ID="Label3" runat="server" Text="Email:"></asp:Label>  
  73.                         </td>  
  74.                         <td class="style2">  
  75.                             <asp:TextBox ID="TextBox3" runat="server" Height="22px" MaxLength="15" Width="158px"></asp:TextBox>  
  76.                         </td>  
  77.                         <td>  
  78.                             <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="TextBox3" ErrorMessage="Please Enter your Email ID" ForeColor="#CC0000"></asp:RequiredFieldValidator>  
  79.                         </td>  
  80.                         <td>  
  81.                             <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="TextBox3" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ErrorMessage="Invalid Email Id"></asp:RegularExpressionValidator>  
  82.                         <td>  
  83.                         </td>  
  84.                         </td>  
  85.                     </tr>  
  86.                     <tr>  
  87.                         <td class="style1">  
  88.                             <asp:Label ID="Label4" runat="server" Text="Phone No. :"></asp:Label>  
  89.                         </td>  
  90.                         <td class="style2">  
  91.                             <asp:TextBox ID="TextBox4" runat="server" Height="22px" MaxLength="10" Width="158px"></asp:TextBox>  
  92.                         </td>  
  93.                         <td>  
  94.                             <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="TextBox4" ErrorMessage="Please Enter your Phone No" ForeColor="#CC0000"></asp:RequiredFieldValidator>  
  95.                         </td>  
  96.                         <td>  
  97.                             <asp:FilteredTextBoxExtender ID="FilteredTextBoxExtender3" TargetControlID="TextBox4" FilterType="Numbers" runat="server"></asp:FilteredTextBoxExtender>  
  98.                         </td>  
  99.                     </tr>  
  100.                     <tr>  
  101.                         <td class="style1">  
  102.                             <asp:Label ID="Label5" runat="server" Text="Location:"></asp:Label>  
  103.                         </td>  
  104.                         <td class="style2">  
  105.                             <asp:TextBox ID="TextBox5" runat="server" Height="22px" MaxLength="15" Width="158px"></asp:TextBox>  
  106.                         </td>  
  107.                         <td>  
  108.                             <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="TextBox5" ErrorMessage="Please Enter your Location" ForeColor="#CC0000"></asp:RequiredFieldValidator>  
  109.                         </td>  
  110.                         <td>  
  111.                             <asp:FilteredTextBoxExtender ID="FilteredTextBoxExtender4" TargetControlID="TextBox5" FilterType="Numbers,LowercaseLetters,UppercaseLetters" runat="server"></asp:FilteredTextBoxExtender>  
  112.                         </td>  
  113.                     </tr>  
  114.                     <tr>  
  115.                         <td class="style1">  
  116.                         </td>  
  117.                         <td class="style2">  
  118.                         </td>  
  119.                         <td>  
  120.                         </td>  
  121.                     </tr>  
  122.                     <tr>  
  123.                         <td class="style1">  
  124.                         </td>  
  125.                         <td class="style2">  
  126.                             <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Submit" />  
  127.                         </td>  
  128.                         <td>  
  129.                         </td>  
  130.                     </tr>  
  131.                 </table>  
  132.             </div>  
  133.         </form>  
  134.     </body>  
  135.   
  136. </html>   
Figure 3 Design Chamber
 

CODE CHAMBER

 
Step 7
In Solution Explorer under validation.aspx the validation.aspx.cs file is there. We will try our code in this file.
 
 
Figure 4 Namespace 
  1. using System;    
  2. using System.Collections.Generic;    
  3. using System.Linq;    
  4. using System.Web;    
  5. using System.Web.UI;    
  6. using System.Web.UI.WebControls;    
  7. using System.Data.SqlClient;    
  8. using System.Data;    
  9. public partial class _Default: System.Web.UI.Page     
  10. {    
  11.     protected void Page_Load(object sender, EventArgs e)     
  12.     {    
  13.     }    
  14.     protected void Button1_Click(object sender, EventArgs e)     
  15.     {    
  16.         SqlConnection con = new SqlConnection(@    
  17.         "Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Database.mdf;Integrated Security=True;User Instance=True");    
  18.         SqlCommand cmd = new SqlCommand("sp_insert", con);    
  19.         cmd.CommandType = CommandType.StoredProcedure;    
  20.         cmd.Parameters.AddWithValue("fname", TextBox1.Text);    
  21.         cmd.Parameters.AddWithValue("lname", TextBox2.Text);    
  22.         cmd.Parameters.AddWithValue("email", TextBox3.Text);    
  23.         cmd.Parameters.AddWithValue("phoneno", TextBox4.Text);    
  24.         cmd.Parameters.AddWithValue("location", TextBox5.Text);    
  25.         con.Open();    
  26.         int i = cmd.ExecuteNonQuery();    
  27.         con.Close();    
  28.     }    
  29. }   
I have attached the entire source code so that you can understand better. I hope you like this. Thank you.
 
Have a nice day!


Similar Articles