Introduction

In this article, I will explain how to create a registration form in ASP.NET C#. This article also explains how we use Stored Procedures instead of explicit SQL statements to add data from a form to a database.

registration form

Use the following procedure to create a sample.

Step 1: Create a database and add a table for storing the data as in the following:

table

Step 2: Create a Stored Procedure to store the records in the database as in the following:
  1. Create PROCEDURE [dbo].[sp_EmpInformation]
  2. @UserName varchar(50),
  3. @Password varchar(50),
  4. @FirstName varchar(50),
  5. @LastName varchar(50),
  6. @Email varchar(50),
  7. @PhoneNo varchar(50),
  8. @Location varchar(50),
  9. @Created_By varchar(50),
  10. @ERROR VARCHAR(100) OUT
  11. AS
  12. BEGIN-- SET NOCOUNT ON added to prevent extra result sets from-- interfering with SELECT statements.
  13. SET NOCOUNT ON;
  14. ---Checking Condition if User exists or not if user not exists returns different message if exists returns different message
  15. IF NOT EXISTS(SELECT * FROM Employee_Information WHERE UserName=@UserName)
  16. BEGIN INSERT INTO Employee_Information
  17. (
  18. UserName,
  19. [Password],
  20. FirstName,
  21. LastName,
  22. Email,
  23. PhoneNo,
  24. Location,
  25. Created_By
  26. )VALUES(@UserName,
  27. @Password,
  28. @FirstName,
  29. @LastName,
  30. @Email,
  31. @PhoneNo,
  32. @Location,
  33. @Created_By
  34. )
  35. SET @ERROR=@UserName+' has registered successfully.'
  36. END
  37. ELSE
  38. BEGIN
  39. SET @ERROR=@UserName + ' has already exists.'
  40. END
  41. End

Step 3: Open Visual Studio and select create Web application.

Step 4: Add a new Web page Emp_Registration.aspx and design it as below:

  1. <div>
  2. <asp:ScriptManager ID="SM1" runat="server">
  3. </asp:ScriptManager>
  4. <table align="center">
  5. <tr>
  6. <td align="center" colspan="2">
  7. <h2>
  8. Registration Form</h2>
  9. </td>
  10. </tr>
  11. <tr>
  12. <td>
  13. <asp:Label ID="lbluser" runat="server" Text="Username"></asp:Label>
  14. </td>
  15. <td>
  16. <asp:TextBox ID="txtuser" runat="server"></asp:TextBox>
  17. </td>
  18. </tr>
  19. <tr>
  20. <td>
  21. <asp:Label ID="lblpwd" runat="server" Text="Password"></asp:Label>
  22. </td>
  23. <td>
  24. <asp:TextBox ID="txtpwd" runat="server" TextMode="Password"></asp:TextBox>
  25. </td>
  26. </tr>
  27. <tr>
  28. <td>
  29. <asp:Label ID="lblcnfmpwd" runat="server" Text="Confirm Password"></asp:Label>
  30. </td>
  31. <td>
  32. <asp:TextBox ID="txtcnmpwd" runat="server" TextMode="Password"></asp:TextBox>
  33. </td>
  34. </tr>
  35. <tr>
  36. <td>
  37. <asp:Label ID="lblfname" runat="server" Text="FirstName"></asp:Label>
  38. </td>
  39. <td>
  40. <asp:TextBox ID="txtfname" runat="server"></asp:TextBox>
  41. </td>
  42. </tr>
  43. <tr>
  44. <td>
  45. <asp:Label ID="lbllname" runat="server" Text="LastName"></asp:Label>
  46. </td>
  47. <td>
  48. <asp:TextBox ID="txtlname" runat="server"></asp:TextBox>
  49. </td>
  50. </tr>
  51. <tr>
  52. <td>
  53. <asp:Label ID="lblemail" runat="server" Text="Email"></asp:Label>
  54. </td>
  55. <td>
  56. <asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
  57. </td>
  58. </tr>
  59. <tr>
  60. <td>
  61. <asp:Label ID="lblCnt" runat="server" Text="Phone No"></asp:Label>
  62. </td>
  63. <td>
  64. <asp:TextBox ID="txtphone" runat="server"></asp:TextBox>
  65. </td>
  66. </tr>
  67. <tr>
  68. <td>
  69. <asp:Label ID="lbladd" runat="server" Text="Location"></asp:Label>
  70. </td>
  71. <td align="left">
  72. <asp:TextBox ID="txtlocation" runat="server"></asp:TextBox>
  73. </td>
  74. </tr>
  75. <tr>
  76. <td>
  77. </td>
  78. <td valign="middle">
  79. <asp:UpdatePanel ID="UP1" runat="server">
  80. <ContentTemplate>
  81. <table>
  82. <tr>
  83. <td style="height: 50px; width: 100px;">
  84. <asp:Image ID="imgCaptcha" runat="server" />
  85. </td>
  86. <td valign="middle">
  87. <asp:Button ID="btnRefresh" runat="server" Text="Refresh" OnClick="btnRefresh_Click" />
  88. </td>
  89. </tr>
  90. </table>
  91. </ContentTemplate>
  92. </asp:UpdatePanel>
  93. </td>
  94. </tr>
  95. <tr>
  96. <td>
  97. Enter above captcha code :
  98. </td>
  99. <td>
  100. <asp:TextBox ID="txtCaptcha" runat="server" Width="200px"></asp:TextBox>
  101. </td>
  102. </tr>
  103. <tr>
  104. <td align="left" colspan="2">
  105. <asp:Button ID="btnsubmit" runat="server" Text="Save" OnClick="btnsubmit_Click" />
  106. <asp:Button ID="btnReset" Text="Reset" runat="server" />
  107. </td>
  108. </tr>
  109. <tr>
  110. <td colspan="2">
  111. <span style="color: Red; font-weight: bold">
  112. <asp:Label ID="lblErrorMsg" runat="server"></asp:Label></span>
  113. </td>
  114. </tr>
  115. </table>
  116. </div>

Step 5: Go to the Emp_Registration.aspx.cs page and add code.

Step 6 : Add code for the Page Load as below:

  1. protected void Page_Load(object sender, EventArgs e)
  2. {
  3. FillCapctha();
  4. }
  5. void FillCapctha()
  6. {
  7. try
  8. {
  9. Random random = new Random();
  10. string combination = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
  11. StringBuilder captcha = new StringBuilder();
  12. for (int i = 0; i < 6; i++)
  13. {
  14. captcha.Append(combination[random.Next(combination.Length)]);
  15. Session["captcha"] = captcha.ToString();
  16. imgCaptcha.ImageUrl = "GenerateCaptcha.aspx?" + DateTime.Now.Ticks.ToString();
  17. }
  18. catch
  19. {
  20. throw;
  21. }
  22. }

Step 7: Add code for the button Submit click as in the following:

  1. protected void btnsubmit_Click(object sender, EventArgs e)
  2. {
  3. if (Session["captcha"].ToString() != txtCaptcha.Text)
  4. lblErrorMsg.Text = "Invalid Captcha Code";
  5. else
  6. {
  7. if (txtpwd.Text == txtcnmpwd.Text)
  8. {
  9. string UserName = txtuser.Text;
  10. string Password = txtpwd.Text;
  11. string ConfirmPassword = txtcnmpwd.Text;
  12. string FirstName = txtfname.Text;
  13. string LastName = txtlname.Text;
  14. string Email = txtEmail.Text;
  15. string Phoneno = txtphone.Text;
  16. string Location = txtlocation.Text;
  17. string Created_By = txtuser.Text;
  18. SqlConnection con = new SqlConnection(@"Data Source=.\sqlexpress;Initial Catalog=LMS;Integrated Security=True");
  19. con.Open();
  20. SqlCommand cmd = new SqlCommand("sp_EmpInformation", con);
  21. cmd.CommandType = CommandType.StoredProcedure;
  22. cmd.Parameters.AddWithValue("@UserName", UserName);
  23. cmd.Parameters.AddWithValue("@Password", Password);
  24. cmd.Parameters.AddWithValue("@FirstName", FirstName);
  25. cmd.Parameters.AddWithValue("@LastName", LastName);
  26. cmd.Parameters.AddWithValue("@Email", Email);
  27. cmd.Parameters.AddWithValue("@PhoneNo", Phoneno);
  28. cmd.Parameters.AddWithValue("@Location", Location);
  29. cmd.Parameters.AddWithValue("@Created_By", Created_By);
  30. cmd.Parameters.Add("@ERROR", SqlDbType.Char, 500);
  31. cmd.Parameters["@ERROR"].Direction = ParameterDirection.Output;
  32. cmd.ExecuteNonQuery();
  33. if (!string.IsNullOrEmpty(cmd.Parameters["@ERROR"].Value.ToString()))
  34. {
  35. message = (string)cmd.Parameters["@ERROR"].Value;
  36. }
  37. con.Close();
  38. }
  39. else
  40. {
  41. Page.RegisterStartupScript("UserMsg", "<Script language='javascript'>alert('" + "Password mismatch" + "');</script>");
  42. }
  43. lblErrorMsg.Text = message;
  44. ClearControls();
  45. }
  46. }

Step 8: Add code for the Refresh button as in the following:

  1. protected void btnRefresh_Click(object sender, EventArgs e)
  2. {
  3. FillCapctha();
  4. }

Step 9: Add another Webform GenerateCaptcha.aspx

Step 10: Add the following code on the page Load of GenerateCaptcha.aspx:

  1. Response.Clear();
  2. int height = 30;
  3. int width = 100;
  4. Bitmap bmp = new Bitmap(width, height);
  5. RectangleF rectf = new RectangleF(10, 5, 0, 0);
  6. Graphics g = Graphics.FromImage(bmp);
  7. g.Clear(Color.White);
  8. g.SmoothingMode = SmoothingMode.AntiAlias;
  9. g.InterpolationMode = InterpolationMode.HighQualityBicubic;
  10. g.PixelOffsetMode = PixelOffsetMode.HighQuality;
  11. g.DrawString(Session["captcha"].ToString(), new Font("Thaoma", 12, FontStyle.Italic), Brushes.Chocolate, rectf);
  12. g.DrawRectangle(new Pen(Color.Blue), 1, 1, width - 2, height - 2);
  13. g.Flush();
  14. Response.ContentType = "image/jpeg";
  15. bmp.Save(Response.OutputStream, ImageFormat.Jpeg);
  16. g.Dispose();
  17. bmp.Dispose();

Step 11: Press F5 to run the application.

Step 12: Add a new entry in the registration form as in the following:

Entry in registration form

Step 13: Records are stored in the database as below:
Records stored in the database

Conclusion

In this article, I have explained how to work with a registration form with Captcha feature and store data in SQL Server using Stored Procedure.