Finalizing the Form
October 16, 2000
Adding a Username and Password to the Form
The nice thing about generic designs is that they are re-usable, which
saves a lot of headache and a lot of coding if done correctly. Since
the data we need to collect is already ready to go in our existing form,
we need only add some logic for a username and password. I think
adding them to the top of the form is most appropriate, so in an
abbreviated format, here is what it should look like:
<%
const numFields = 11
'change the above from 9 to 11
dim errorArray()
redim preserve errorArray(numFields)
if request.form("isSubmitted") = "yes" then
'add username and password here
username = request.form("username")
password = request.form("password")
first_name = request.form("first_name")
last_name = request.form("last_name")
social_security = request.form("social_security")
address = request.form("address")
city = request.form("city")
state = request.form("state")
zip_code = request.form("zip_code")
telephone = request.form("telephone")
email = request.form("email")
'the rest of your ASP goes here...
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Form Field Validation Sample</title>
</head>
<body>
<% if ErrorMsg <> "" then %>
<font color="red" size="3"><b>
<%= ErrorMsg %>
</font><br>
<% end if %>
<form name="sample1" method="post">
<table width="50%" cellspacing="1" cellpadding="0" border="0">
<!-- NEW CODE GOES HERE -->
<tr>
<td>
<% if errorArray(9) = "True" then %>
<font color="red"><b>
<% end if %>Username:
<% if errorArray(9) = "True" then %>
</b></font>
<% end if %>
</td>
<td>
<input name="username" size="10"
maxlength="10" value="<%= username %>">
</td>
</tr>
<tr>
<td>
<% if errorArray(10) = "True" then %>
<font color="red"><b>
<% end if %>Password:
<% if errorArray(10) = "True" then %>
</b></font>
<% end if %>
</td>
<td>
<input type="password" name="password"
size="10" maxlength="10">
</td>
</tr>
<!-- END NEW CODE -->
<!-- RESUME REST OF OLD CODE -->
Some things to note in the above code. First and foremost, remember
to change the number of required fields assigned to the constant
numFields. That is very important for validation, because
it defines how many elements will be in the errorArray.
Also note that rather then renumbering everything, we are merely
tacking two elements on the end for Username and Password. It does
not matter if they appear first or last in the actual HTML for the
form. Lastly, we need to discuss how we will validate this information.
There are a number of considerations to take into account. First,
neither username nor password can be left blank. Second, username
should be greater then four characters and can be made up of
alphanumeric characters. Password must be at least eight characters
long and can also be made up of alphanumeric characters. Third,
username cannot be the same as a username already stored in the
database. For now, we can easily deal with the first two
considerations, but until we learn about how to talk to the database,
the third will have to wait.
To be consistent, I recommend using regular expressions to validate
the username and password. However, do not feel required to do so, any
way you think up that is best for you will do fine. The two blocks of
code shown below both utilize regular expression patterns that check
for \w or any alphabetic or numeric character (including
underscore). It checks for four characters in the case of username
and 8 in the case of password. Note that the $ was
omitted from the end of the pattern so that it does not match against
the whole field globally - that means a user can have a larger
username then four if they want - up to the maximum length of the
input field. Again, I will leave it up to you to spruce up things like
the error message (ErrorMsg).
'...
'Username
re.Pattern = "\w{4}"
results = re.Test(username)
if results then
errorArray(9) = "False"
else
errorArray(9) = "True"
ErrorMsg = ErrorMsg & "Username<br>"
end if
'Password
re.Pattern = "\w{8}"
results = re.Test(password)
if results then
errorArray(10) = "False"
else
errorArray(10) = "True"
ErrorMsg = ErrorMsg & "Password<br>"
end if
'...
NOTE: Do not forget to modify the
ErrorMsg code for First Name. It should now look like
ErrorMsg = ErrorMsg & "First Name<br>". You need to
do this so that if there is an error for Username or Password, those
will show up in the message. If you omit this, Username and Password
will be highlighted red, but will not be included in the list at the
top of the page!
|
All right, now that the username and password are squared away (at least
for the time being), move on to the next page and we will talk about
setting up the database.
Part 3 - Building a Registration Database
Part 3 - Building a Registration Database
Web Databases 101
|