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">
  6. <head runat="server">
  7. <title></title>
  8. <style type="text/css">
  9. .style1 {
  10. width: 122px;
  11. }
  13. .style2 {
  14. width: 239px;
  15. }
  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>
  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>
  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!