Registration Form with Bootstrap
How to Create Registration Form with DotNet and Bootstrap
ASPX Code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Form</title>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<style type="text/css">
.container{
margin-bottom: 30px;
}
.col-md-6{
margin: 0 auto;
box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.1), 3px 6px 10px rgba(0, 0, 0, 0.2);
padding: 20px 30px;
}
h2{
padding: 20px 0px;
}
</style>
</head>
<body style="background-image:url('Images/ppt.jpg'); background-size:cover;">
<div class="container">
<h2 class="text-center">Registration Form</h2>
<form id="form1" runat="server">
<div class="col-md-6">
<asp:Label ID="Label1" runat="server" Text="First Name"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txtfirstName" runat="server" CssClass="form-control" placeholder="Enter the First Name" required=""></asp:TextBox>
</div>
<asp:Label ID="Label2" runat="server" Text="Last Name"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txtlastName" runat="server" CssClass="form-control" placeholder="Enter the Last Name" required=""></asp:TextBox>
</div>
<asp:Label ID="Label8" runat="server" Text="Email"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txtEmail" runat="server" CssClass="form-control" placeholder="Enter the Email" required=""></asp:TextBox>
</div>
<asp:Label ID="Label7" runat="server" Text="Mobile"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txtPhone" runat="server" CssClass="form-control" placeholder="Enter the Mobile no." MaxLength="10" required=""></asp:TextBox>
</div>
<asp:Label ID="Label11" runat="server" Text="Current Business Type"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="TextBox1" runat="server" CssClass="form-control" placeholder="Mention your current Business Type" required=""></asp:TextBox>
</div>
<%--<asp:Label ID="Label3" runat="server" Text="Gender"></asp:Label>
<div class="form-group input-group">
<asp:RadioButtonList ID="RadioGender" runat="server" AutoPostBack="True" RepeatDirection="Horizontal" CssClass="form-control">
<asp:ListItem>Male</asp:ListItem>
<asp:ListItem>Female</asp:ListItem>
<asp:ListItem>Other</asp:ListItem>
</asp:RadioButtonList>
</div>--%>
<%--<asp:Label ID="Label4" runat="server" Text="Date of Birth"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txtDOB" runat="server" CssClass="form-control" ></asp:TextBox>
</div>--%>
<asp:Label ID="Label5" runat="server" Text="Address"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txtAddress" runat="server" CssClass="form-control" placeholder="Enter the Address" TextMode="MultiLine" required=""></asp:TextBox>
</div>
<asp:Label ID="Label9" runat="server" Text="State"></asp:Label>
<div class="form-group input-group">
<asp:DropDownList ID="DDLState" runat="server" CssClass="form-control" AutoPostBack="True">
<asp:ListItem>Select State</asp:ListItem>
<asp:ListItem>Andhra Pradesh</asp:ListItem>
<asp:ListItem>Arunachal Pradesh</asp:ListItem>
<asp:ListItem>Assam</asp:ListItem>
<asp:ListItem>Bihar</asp:ListItem>
<asp:ListItem>Chhattisgarh</asp:ListItem>
<asp:ListItem>Goa</asp:ListItem>
<asp:ListItem>Gujarat</asp:ListItem>
<asp:ListItem>Haryana</asp:ListItem>
<asp:ListItem>Himachal Pradesh</asp:ListItem>
<asp:ListItem>Jammu and Kashmir</asp:ListItem>
<asp:ListItem>Jharkhand</asp:ListItem>
<asp:ListItem>Karnataka</asp:ListItem>
<asp:ListItem>Kerala</asp:ListItem>
<asp:ListItem>Madhya Pradesh</asp:ListItem>
<asp:ListItem>Maharashtra</asp:ListItem>
<asp:ListItem>Manipur</asp:ListItem>
<asp:ListItem>Meghalaya</asp:ListItem>
<asp:ListItem>Mizoram</asp:ListItem>
<asp:ListItem>Nagaland</asp:ListItem>
<asp:ListItem>Odisha</asp:ListItem>
<asp:ListItem>Punjab</asp:ListItem>
<asp:ListItem>Rajasthan</asp:ListItem>
<asp:ListItem>Sikkim</asp:ListItem>
<asp:ListItem>Tamil Nadu</asp:ListItem>
<asp:ListItem>Telangana</asp:ListItem>
<asp:ListItem>Tripura</asp:ListItem>
<asp:ListItem>Uttar Pradesh</asp:ListItem>
<asp:ListItem>Uttarakhand</asp:ListItem>
<asp:ListItem>West Bengal</asp:ListItem>
</asp:DropDownList>
</div>
<asp:Label ID="Label10" runat="server" Text="District"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txtdistrict" runat="server" CssClass="form-control" placeholder="Enter the District" required=""></asp:TextBox>
</div>
<asp:Label ID="Label3" runat="server" Text="Taluka"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txttaluka" runat="server" CssClass="form-control" placeholder="Enter the Taluka" required=""></asp:TextBox>
</div>
<asp:Label ID="Label4" runat="server" Text="Village"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txtvillage" runat="server" CssClass="form-control" placeholder="Enter the Village" required=""></asp:TextBox>
</div>
<asp:Label ID="Label6" runat="server" Text="Pin"></asp:Label>
<div class="form-group input-group">
<asp:TextBox ID="txtPin" runat="server" CssClass="form-control" placeholder="Enter the Pin" MaxLength="6" required=""></asp:TextBox>
</div>
<%--<div class="form-group form-check">
<label class="form-check-label">
<input class="form-check-input" type="checkbox" name="remember"/>I would like to attend ETI training and please send the details on above mail and I'm ready to pay training fees of Rs 500/-
</label>
</div> --%>
<div class="button-group">
<asp:CheckBox ID="CheckBox1" runat="server" OnCheckedChanged="CheckBox1_CheckedChanged" Text="I would like to attend ETI training and please send the details on above mail and I'm ready to pay training fees of Rs 500/-" />
</div>
<div class="button-group">
<asp:Button ID="btnRegister" runat="server" Text="Register" CssClass="btn btn-success" OnClick="btnRegister_Click" Enabled="False" />
<asp:Button ID="btnClear" runat="server" Text="Clear" CssClass="btn btn-danger" />
</div>
<asp:Label ID="lblsuccess" runat="server" Text="Label"></asp:Label>
<asp:Label ID="lblwarning" runat="server" Text="Label"></asp:Label>
</div>
<div><marquee><h2>Company Name</h2></marquee></div>
</form>
</div>
</body>
</html>
ASPX.CS Code
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Web.Script;
public partial class _Default : System.Web.UI.Page
{
SqlConnection con = new SqlConnection(@"DataSource");
protected void Page_Load(object sender, EventArgs e)
{
clear();
}
protected void btnRegister_Click(object sender, EventArgs e)
{
{
try
{
con.Open();
if (txtfirstName.Text != "" && txtlastName.Text != "" && txtEmail.Text != "" && txtPhone.Text != "" && txtAddress.Text != "" && DDLState.Text != "" && txtdistrict.Text != "" && txttaluka.Text != "" && txtvillage.Text != "" && txtPin.Text != "")
{
SqlCommand cmd = new SqlCommand("Insert into VLE values ('" + txtfirstName.Text.ToString() + "','" + txtlastName.Text.ToString() + "','" + txtEmail.Text.ToString() + "','" + txtPhone.Text.ToString() + "','" + txtAddress.Text.ToString() + "','" + DDLState.Text.ToString() + "','" + txtdistrict.Text.ToString() + "','" + txttaluka.Text.ToString() + "','" + txtvillage.Text.ToString() + "','" + txtPin.Text.ToString() + "')", con);
cmd.ExecuteNonQuery();
con.Close();
lblsuccess.Text = "Record Inserted Successfully";
}
else
{
lblwarning.Text = "Failed to save the record";
}
}
catch (Exception ex)
{
lblwarning.Text =ex.Message;
}
}
Page.ClientScript.RegisterStartupScript(this.GetType(), "Scripts", "<script>alert('Transaction Succesfully Completed');</script>");
}
public void clear()
{
txtfirstName.Text= "";
txtlastName.Text = "";
txtEmail.Text = "";
txtPhone.Text = "";
txtAddress.Text = "";
DDLState.Text = "";
txtdistrict.Text = "";
txttaluka.Text = "";
txtvillage.Text = "";
txtPin.Text = "";
}
protected void CheckBox1_CheckedChanged(object sender, EventArgs e)
{
if (CheckBox1.Checked == true)
btnRegister.Enabled = true;
else
btnRegister.Enabled = false;
}
}
Very helpful
ReplyDelete