The Code Given is for only beginners in HTML
1.The code implements a simple login form
2.It checks whether the password and usernames are matching or not
3.While you are using replace the predefined username and password that I'v given
that is replace "myuserid" and "mypswrd" with your own userid and password.
4.just copy the file and paste it in the notepad.
5.and save it with an extension of .html or .htm
6.select 'All Files' from the popupmenu shown at the bottom of notepad before saving.
7.Now you will get a document that has the symbol of internet explorer.
8.just open that file and if the computer ask for script activation press ok.
9.Now run your page
10.You can customize the page by applying CSS.
Try it....
It's Your friend,,,
Rajeesh.N.Santhu
A Simple HTML Login page using JavaScript
<html>
<head>
<title>
Login page
</title>
</head>
<body>
<h1 style="font-family:Comic Sans Ms;text-align="center";font-size:20pt;
color:#00FF00;>
Simple Login Page
</h1>
<form name="login">
Username<input type="text" name="userid"/>
Password<input type="password" name="pswrd"/>
<input type="button" onclick="check(this.form)" value="Login"/>
<input type="reset" value="Cancel"/>
</form>
<script language="javascript">
function check(form)/*function to check userid & password*/
{
/*the following code checkes whether the entered userid and password are matching*/
if(form.userid.value == "myuserid" && form.pswrd.value == "mypswrd")
{
window.open('target.html')/*opens the target page while Id & password matches*/
}
else
{
alert("Error Password or Username")/*displays error message*/
}
}
</script>
</body>
</html>
well this is good worked but can you give example as we have to create switch case with something like goto..
Quick and simple. I like it. Be nice to add multiple user logins.
really thank u
But........really it has no point :S
More than login page, it shows how a if works.
Good for begginers
As a beginner's study-case, this is nice, thumbs up for that, but...
Where's the mention about that storing login-information in javascript is anything but secure? This stuff is useful only for a toy or studying how things work, and should never be actually used on a real web-page, and this should be clearly mentioned somewhere in the original post. If you think that "every people will realize things like that", you're so absolutely wrong.
@riahc3:
I've been working with javascript for years, but "this.form" inside input-element is new thing for me.
Anyone can read the javascript source code from the web page, and figure out the password.
huhhh.. then is not secure...
Is there a more secure way to do this? As mentioned before, one can open the page in inspect element and see the username and password. I was thinking a separate JavaScript file where multiple users can be saved and stored with less risk. Can anyone help me out?
I was thinking a separate JavaScript file where multiple users can be saved and stored with less risk.
Still the same problem that all files are readable. You'll need to use a server-side script to validate.
ANY clientside validation of users MUST be considered visible. In order to be secure, the connection must be encrypted (https) AND validation done on the server. For low value, low risk applications, https might be skipped, but clientside login validation is as safe as taping your house key to the outside of your door.
<script type = "text/javascript">
// Note: Like all Javascript password scripts, this is hopelessly insecure as the user can see
//the valid usernames/passwords and the redirect url simply with View Source.
// And the user can obtain another three tries simply by refreshing the page.
//So do not use for anything serious!
var count = 2;
function validate() {
var un = document.myform.username.value;
var pw = document.myform.pword.value;
var valid = false;
var unArray = ["username1", "username2", "username3", "username4"]; // as many as you like - no comma after final entry
var pwArray = ["password1", "password2", "password3", "password4"]; // the corresponding passwords;
for (var i=0; i <unArray.length; i++) {
if ((un == unArray[i]) && (pw == pwArray[i])) {
valid = true;
break;
}
}
if (valid) {
alert ("Login was sucessfully processed. You will be redirected to the members page now.");
window.location = "http://www.google.com";
return false;
}
var t = " tries";
if (count == 1) {t = " try"}
if (count >= 1) {
alert ("Invalid username and/or password. You have " + count + t + " left.");
document.myform.username.value = "";
document.myform.pword.value = "";
setTimeout("document.myform.username.focus()", 25);
setTimeout("document.myform.username.select()", 25);
count --;
}
else {
alert ("Still incorrect! You have no more tries left!");
document.myform.username.value = "No more tries allowed!";
document.myform.pword.value = "";
document.myform.username.disabled = true;
document.myform.pword.disabled = true;
return false;
}
}
</script>
<form name = "myform">
<p>ENTER USER NAME <input type="text" name="username"> ENTER PASSWORD <input type="password" name="pword">
<input type="button" value="Check In" name="Submit" onclick= "validate()">
</p>
</form>
thnx... i felt it really helpful as m jus a beginner
suppose if we have a login screen on domain.com and we redirect the page to domain.com/dashboard after login. Here domain.com/dashboard can still be accessed if the visitor puts that in browser directly.
Any solution for that.
Further the password would be still visible from the source code.
Sud, the op is long gone, its three years old
the code, was garbage then, is garbage now
Clientside is not where login is managed,
thats a server function
every blog or cms includes user management, from wordpress up down and sideways, to custom written applications
how can i add email in place of username ????
^ Read what they are saying: this is garbage, start looking at a server-side language.
heir am tring to write username and password but still it is not accepting why?
help me to create a page that compare login username and the password values
and allow access if the username and the password matches
Could you imagine how quick that code would be to hack? I think for anyone interested in doing a secure login pop over to the php forum and ask about setting up sha-256 or gnupg encryption for sending login information to a database. It isn't exactly beginner stuff but definitely secure.
Let's kill this thread. Please. The OP provided a very very bad piece of code that nobody in their right mind would contemplate using. This is not the thread to start providing new solutions ("login page using javascript") as they would be just as mad. If you want a login script search the server-side language forum of your choice (Java, PHP, ASP etc etc).
The next person that resurrects this thread without due reason will receive a neg rep because they failed to read the preceeding posts. Replying here will just float this useless thread to the top of the forum's latest thread list.
Just think...
suppose if we have a login screen on domain.com and we redirect the page to domain.com/dashboard after login. Here domain.com/dashboard can still be accessed if the visitor puts that in browser directly.
Any solution for that.
Further the password would be still visible from the source code.
Can i get a solution for this asap....
Wow, thank you so much for making this so understandable and simple.
Can i place this in a .js ?
Not advisable. Did you read the thread?
Have can the top code be extended for more than one username and password?
can any one pls tell me code that all the user names and passwords are maitained in a database instead of javascript..........
and whenever we enter a username it acces database and checks for validaion..
plz reply me.
OMG... can someone please kill this thread??? :)
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.