.NET

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

Up Next
    Ebook Download
    View all
    Learn
    View all
    Get Started

    You need to be a premium member to use this feature. To access it, you'll have to upgrade your membership.

    Become a sharper developer and jumpstart your career.

    Basic

    $0

    $

    . 00

    monthly

    For Basic members:

    • Standard Profile
    • Access learning courses
    • Access free e-books
    • 1x point
    Premium

    $20

    $

    . 00

    monthly

    For Premium members:

    • Earn 2x reward points
    • Premium profile with Verified check
    • Premium Avatar with status update
    • Learning courses
    • Unlimited Certifications and badges on profile
    • Unlimited Book downloads
    • Access to Premium content
    • Online Training
    • Unlimited PDF conversions and downloads
    • Professional Resume Writing
    • Interview Preparations Guide
    • 25 messages per month
    • 1 "Kodzu" avatar, basic
    Elite

    $45

    $

    . 00

    monthly

    For Elite members:

    • Bundle E-books
    • Access to all Learn Series
    • Unlimited Apply Jobs