Javascript Password Validation

April 19th, 2009 by Ian O'Donnell

Nothing is worse than spending forever googling for how to accomplish a certain task only to find pages that don’t answer your question. So just to clarify, here is what we will be covering.

  • Checking Password Length
  • Matching 2 password fields
  • Giving the error to the user without reloading the page

And this is an Example too.

In the current state of web design it is extremely desireable to give errors to the user without reloading pages, especially when it comes to forms. This makes the experience smoother for the user which is what we should be aiming for.

First things first let’s just clarify the html page and css so we know all our field names etc. Here is the code I am using for this example:

?Download html.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

<head>
 
    <title>Validating Password</title>
 
    <link rel="stylesheet" href="styles.css" type="text/css" />
    <script type="text/javascript">
 
    </script>
 
</head>
<body>
 
     <form>
          Password: <input type="password" id="pass1" value="" maxlength="20" onkeyup="chkpassword()" />
          <br />
          Enter Password again: <input type="password" id="pass2" value="" maxlength="20" onkeyup="chkpassword()" />
     </form>
 
     <div id="passwordAlert" ></div>
 
</body>

Ok so the html isn’t the most elegant etc :) But this will serve perfect for our example don’t worry about it :P

The script tags in the head element is where we will put our Javascript. This could of course be place in an external file but for testing it out it is quite often easier to leave it in the Read the rest of this entry »

, , , , , , , , , , , , , , , , , , , , , ,

Make your link creation easier and faster.

September 29th, 2008 by Ian O'Donnell

Ok this tip first of can be used for any forum, platform or service which requires a specific format of link. for example forums usually want something like [link=http://www.ianodonnell.com]Home Page[/link] which can be annoying as it takes time compared to just a simple copy paste.

I will use the Microblogging service Jaiku as an example here for this one but as I said it can be used for any service and is very easy to modify, I achieved this through Firefox and an addon called Make Link. you should go get it immediately. Install it from the link provided and once you have, restart Firefox and we are ready to finish up.

In your addon list (*Tools -> Addons) click options on the Make Link addon and click “new”. The format we need for a Jaiku link is [link text](url), so, Put in anything Read the rest of this entry »

, , , , , , , , , , , , , , ,