Create a Responsive User Registration Page in ASP.NET using Bootstrap and SQL Server Database

 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="signup.aspx.cs" Inherits="Responsive_Registration_Page.signup" %>


<!DOCTYPE html>


<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>User Registration Form</title>

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"/>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>

</head>

<body>

    <div class="container">

        <div class="alert alert-success" role="alert">

          <h4 class="alert-heading">Please Sign up Here!</h4>

          <p>Please enter your correct information</p>

        </div>

        <form class="row g-3" runat="server">

          <div class="col-md-6 form-floating">

            <input type="email" runat="server" class="form-control" id="floatingInput" placeholder="name@example.com"/>

            <label for="floatingInput">Email address</label>

          </div>

          <div class="col-md-6 form-floating">

            <input type="password" runat="server" class="form-control" id="floatingPassword" placeholder="Password"/>

            <label for="floatingPassword">Password</label>

          </div>

          <div class="col-md-6 form-floating">

            <input type="text" runat="server" class="form-control" id="txtFname" placeholder="Ran"/>

            <label for="txtFname">First Name</label>

          </div>

          <div class="col-md-6 form-floating">

            <input type="text" runat="server" class="form-control" id="txtLname" placeholder="Bahadur"/>

            <label for="txtLname">Last Name</label>

          </div>

          <div class="col-12">

            <label for="inputAddress" class="form-label">Address</label>

            <asp:TextBox ID="txtAddress" runat="server" CssClass="form-control"></asp:TextBox>

          </div>

          <div class="col-md-4">

            <label for="inputCountry" class="form-label">Country</label>

            <asp:TextBox ID="txtCountry" runat="server" CssClass="form-control"></asp:TextBox>

          </div>

          <div class="col-md-4">

            <label for="inputState" class="form-label">Gender</label>

            <asp:DropDownList ID="DropDownList1" runat="server" CssClass="form-select">

                <asp:ListItem Value="Select Gender">Select Gender</asp:ListItem>

                <asp:ListItem Value="Male">Male</asp:ListItem>

                <asp:ListItem Value="Female">Female</asp:ListItem>

                <asp:ListItem Value="Others">Others</asp:ListItem>

            </asp:DropDownList>

          </div>

          <div class="col-md-4">

            <label for="inputPhone" class="form-label">Phone</label>

            <asp:TextBox ID="txtPhone" runat="server" CssClass="form-control"></asp:TextBox>

          </div>

          <div class="col-12">

              <asp:Button ID="Button1" runat="server" Text="Signup" CssClass="btn btn-primary" OnClick="Button1_Click"/>

          </div>

        </form>

    </div>

</body>

</html>

ABOVE FILE IS signup.aspx
















using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Data;
using System.Configuration;

namespace Responsive_Registration_Page
{
    public partial class signup : System.Web.UI.Page
    {
        string cs = ConfigurationManager.ConnectionStrings["dbcs"].ConnectionString;
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void EmptyControls()
        {
            floatingInput.Value = "";
            floatingPassword.Value = "";
            txtFname.Value = "";
            txtLname.Value = "";
            txtAddress.Text = "";
            txtCountry.Text = "";
            DropDownList1.SelectedIndex = -1;
            txtPhone.Text = "";
        }

        protected void Button1_Click(object sender, EventArgs e)
        {
            try
            {
                using(SqlConnection con = new SqlConnection(cs))
                {
                    con.Open();
                    string email = floatingInput.Value;
                    string password = floatingPassword.Value;
                    string fname = txtFname.Value;
                    string lname = txtLname.Value;
                    string query = "INSERT INTO userreg(email,password,fname,lname,address,country,gender,phone) VALUES(@email,@password,@fname,@lname,@address,@country,@gender,@phone)";
                    SqlCommand cmd = new SqlCommand(query,con);
                    cmd.Parameters.AddWithValue("@email",email);
                    cmd.Parameters.AddWithValue("@password",password);
                    cmd.Parameters.AddWithValue("@fname",fname);
                    cmd.Parameters.AddWithValue("@lname",lname);
                    cmd.Parameters.AddWithValue("@address",txtAddress.Text);
                    cmd.Parameters.AddWithValue("@country",txtCountry.Text);
                    cmd.Parameters.AddWithValue("@gender",DropDownList1.SelectedValue);
                    cmd.Parameters.AddWithValue("@phone",txtPhone.Text);
                    int a = cmd.ExecuteNonQuery();
                    if (a > 0)
                    {
                        Response.Write("<script>alert('Register Successful !!')</script>");
                        EmptyControls();
                    }
                    else
                    {
                        Response.Write("<script>alert('Register Failed !!')</script>");
                    }
                }
            }
            catch (SqlException ex)
            {
                Response.Write("SqlException : " + ex.Message);
            }
            catch (Exception ex)
            {
                Response.Write("Exception : " + ex.Message);
            }
        }
    }
}
ABOVE FILE IS signup.aspx.cs















<?xml version="1.0" encoding="utf-8"?>
<!--
  For more information on how to configure your ASP.NET application, please visit
  https://go.microsoft.com/fwlink/?LinkId=169433
  -->
<configuration>
  <system.web>
    <compilation debug="true" targetFramework="4.7.2" />
    <httpRuntime targetFramework="4.7.2" />
    <pages>
      <namespaces>
        <add namespace="System.Web.Optimization" />
      </namespaces>
      <controls>
        <add assembly="Microsoft.AspNet.Web.Optimization.WebForms" namespace="Microsoft.AspNet.Web.Optimization.WebForms" tagPrefix="webopt" />
      </controls>
    </pages>
  </system.web>
  <runtime>
    <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
      <dependentAssembly>
        <assemblyIdentity name="Antlr3.Runtime" publicKeyToken="eb42632606e9261f" />
        <bindingRedirect oldVersion="0.0.0.0-3.5.0.2" newVersion="3.5.0.2" />
      </dependentAssembly>
      <dependentAssembly>
        <assemblyIdentity name="Microsoft.Web.Infrastructure" publicKeyToken="31bf3856ad364e35" />
        <bindingRedirect oldVersion="0.0.0.0-2.0.0.0" newVersion="2.0.0.0" />
      </dependentAssembly>
      <dependentAssembly>
        <assemblyIdentity name="Newtonsoft.Json" publicKeyToken="30ad4fe6b2a6aeed" />
        <bindingRedirect oldVersion="0.0.0.0-13.0.0.0" newVersion="13.0.0.0" />
      </dependentAssembly>
      <dependentAssembly>
        <assemblyIdentity name="WebGrease" publicKeyToken="31bf3856ad364e35" />
        <bindingRedirect oldVersion="0.0.0.0-1.6.5135.21930" newVersion="1.6.5135.21930" />
      </dependentAssembly>
    </assemblyBinding>
  </runtime>
  <system.codedom>
    <compilers>
      <compiler language="c#;cs;csharp" extension=".cs" type="Microsoft.CodeDom.Providers.DotNetCompilerPlatform.CSharpCodeProvider, Microsoft.CodeDom.Providers.DotNetCompilerPlatform, Version=2.0.1.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" warningLevel="4" compilerOptions="/langversion:default /nowarn:1659;1699;1701" />
      <compiler language="vb;vbs;visualbasic;vbscript" extension=".vb" type="Microsoft.CodeDom.Providers.DotNetCompilerPlatform.VBCodeProvider, Microsoft.CodeDom.Providers.DotNetCompilerPlatform, Version=2.0.1.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" warningLevel="4" compilerOptions="/langversion:default /nowarn:41008 /define:_MYTYPE=\&quot;Web\&quot; /optionInfer+" />
    </compilers>
  </system.codedom>
<connectionStrings>
<add name="dbcs" connectionString="Data Source=DESKTOP-77M6N4G\SQLEXPRESS;Initial Catalog=userregistration;Integrated Security=True;TrustServerCertificate=True" providerName="System.Data.SqlClient"/>
</connectionStrings>
</configuration>
ABOVE FILE IS Web.config
















CREATE DATABASE userregistration;

USE userregistration;

CREATE TABLE userreg(
email NVARCHAR(50) NOT NULL,
password NVARCHAR(50) NOT NULL,
fname CHAR(10) NOT NULL,
lname CHAR(10) NOT NULL,
address NVARCHAR(50) NOT NULL,
country NVARCHAR(50) NOT NULL,
gender CHAR(10) NOT NULL,
phone NVARCHAR(50) NOT NULL
);

SELECT * FROM userreg;




Comments

Popular posts from this blog

Create a User Registration Form in ASP.NET using SQL Server, Visual Studio 2022 & Bootstrap

Create a Simple Login Form in ASP.NET using Visual Studio 2022

SqlCommand Class ADO.Net | ExecuteNonQuery | ExecuteReader | ExecuteScalar