Login Page in Asp.net with Connected Mode
For to create LogIn page we firstly need to Create a table in Database named LogIn. Below is code of SQL Database
Now Lets move towards the Visual Studio for creating Design for Login Page. If you are new to Visual Studio Environment then you can follow these simple steps to create page.
Open Visual Studio Application => Goto File Menu => Click on New => Select Website.
after that on
Solution Explorer => Right Click => Add =>Add New Item => Select Web Form => Named it LogIn.aspx
On Aspx page use the following Code
<html>
<p><asp:TextBox ID="txtpass" placeholder="Password" runat="server" TextMode="Password"/></p>
<p><a href="#">Forgot Password?</a></p>
For to create LogIn page we firstly need to Create a table in Database named LogIn. Below is code of SQL Database
// create database DbTest………………………
Create database DbTest
Use DbTest
// create table LoginTable in database DbTest………………………
create table LoginTable ( EmailId nvarchar(50) primary key, Password nvarchar(50))
//insert data into table
insert into LogIn values('abc@xyz.com' , '123')
Now we use Procedure for Secure Login and now write some code for create Stored Procedure
Create proc splogin
(
@email nvarchar(250),@password nvarchar(20)
)
as begin
Select COUNT(*)from LogIn where EmailId=@email and Password=@password
end
Now Lets move towards the Visual Studio for creating Design for Login Page. If you are new to Visual Studio Environment then you can follow these simple steps to create page.
Open Visual Studio Application => Goto File Menu => Click on New => Select Website.
after that on
Solution Explorer => Right Click => Add =>Add New Item => Select Web Form => Named it LogIn.aspx
On Aspx page use the following Code
<html>
<head>
<meta charset="utf-8">
<title>Admin LogIn</title>
/*Script code will goes here*/
</head>
<body>
<div id="login">
<h1><strong>LogIn </strong></h1>
<form runat="server">
<fieldset>
<p><asp:TextBox ID="txtuname" placeholder="Email" runat="server" /></p> <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtuname" ErrorMessage="Please Provide UserName" ForeColor="Red"></asp:RequiredFieldValidator>
<p><asp:TextBox ID="txtpass" placeholder="Password" runat="server" TextMode="Password"/></p>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="txtpass" ErrorMessage="Please Provide password" ForeColor="Red"> </asp:RequiredFieldValidator>
<p><a href="#">Forgot Password?</a></p>
<p><asp:Button ID="btnLogIn" runat="server" Text="LogIn" OnClick="btnLogIn_Click"/> </p>
</fieldset>
</form>
</div> <!-- end login -->
</body>
</html>
CSS for Login---
<style type="text/css">
body {
background-color: #f4f4f4;
color: #5a5656;
font-family: 'Open Sans', Arial, Helvetica, sans-serif;
font-size: 16px;
line-height: 1.5em;
}
a { text-decoration: none; }
h1 { font-size: 1em; }
h1, p {
margin-bottom: 10px;
}
strong {
font-weight: bold;
}
.uppercase { text-transform: uppercase; }
#login {
margin: 50px auto;
width: 300px;
}
form fieldset input[type="text"], input[type="password"] {
background-color: #e5e5e5;
border: none;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
color: #5a5656;
font-family: 'Open Sans', Arial, Helvetica, sans-serif;
font-size: 14px;
height: 50px;
outline: none;
padding: 0px 10px;
width: 280px;
-webkit-appearance:none;
}
form fieldset input[type="submit"] {
background-color: #008dde;
border: none;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
color: #f4f4f4;
cursor: pointer;
font-family: 'Open Sans', Arial, Helvetica, sans-serif;
height: 50px;
text-transform: uppercase;
width: 300px;
-webkit-appearance:none;
}
form fieldset a {
color: #5a5656;
font-size: 10px;
}
form fieldset a:hover { text-decoration: underline; }
.btn-round {
background-color: #5a5656;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
color: #f4f4f4;
display: block;
font-size: 12px;
height: 50px;
line-height: 50px;
margin: 30px 125px;
text-align: center;
text-transform: uppercase;
width: 50px;
}
</style>
Now final Step is write down code for to gave functionality to your page. You have to write Backend code in LogIn Button Click which is in C# language.
So on LogIn.Cs page
protected void btnlogin_Click(object sender, EventArgs e)
{
SqlConnection con = new SqlConnection("Data Source=.;Initial Catalog = DbTest; Integrated Security=True");
SqlCommand cmd = new SqlCommand("splogin", con);
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@email", txtemail.Text);
cmd.Parameters.AddWithValue("@password", txtpass.Text);
con.Open();
SqlDataReader dr = cmd.ExecuteReader();
if (dr.Read())
{
Session["un"] = txtemail.Text;
Response.Redirect("Home.aspx");
}
else
{
Response.Write("<script language=javascript>alert('Invalid UserName Or Password');</script>");
con.Close();
}
}
Now you done. Enjoy the code in Simple steps with less efforts.
0 comments:
Post a Comment