Forum Moderators: open

Message Too Old, No Replies

AJAX E-Mail and Password Verification

         

RedChair

5:22 am on Feb 12, 2007 (gmt 0)

10+ Year Member



I have two things that I would like to do with AJAX for a signup form that I am not completely sure how to do.

First, I would like to check to see if an e-mail address has already been added to the database which can be checked with onBlur.

Second, I would like to do a password verification. I would like it to check to ensure the password is between 6-8 characters and for the re-enter password field to make sure the two passwords are the same.

I know it sounds like a lot and it is, but if someone can point me in the right direction, I would appreciate it.

scriptmasterdel

9:15 pm on Feb 12, 2007 (gmt 0)

10+ Year Member



Well for point one you would need ajax but for the second point you can simply use basic javascript.

1) Below is a basic script that will send an ajax request. You can call the function by adding an onBlur event to the field using the followin code

onBlur="sendAjaxRequest("POST", "test.htm", "&1=1", myCallbackFunction)"

The four parameters are:

> requestMethod
POST or GET - depending on what type of data you are going to be sending to the page, they are both pretty much insecure as you can see this via the browser but POST is generally safer.

> theURL
The page that will do the checking of the database records.

> sendString
What you want to send, this will be the value of the field. You can parse that as a parameter if you like using "this.value"

> callbackFunction
This is the function that is called once the function is complete, this will allow you to inform the user is the e-mail address is still in the sytem.

<script>

var ajax = null; // Global

function sendAjaxRequest(requestMethod, theURL, sendString, callbackFunction)
{
if (window.XMLHttpRequest)
ajax = new XMLHttpRequest();
else if (window.ActiveXObject)
ajax = new ActiveXObject("Microsoft.XMLHTTP");

ajax.onreadystatechange = callbackFunction;

switch (requestMethod)
{
case "POST":
ajax.open("POST", theURL, true);
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send(sendString);
break;
case "GET":
ajax.open("GET", theURL, true);
ajax.send(null);
break;
}
}

function myCallbackFunction()
{
if (ajax.readyState == 4)
{
alert(ajax.responseText);
}
}

</script>

2) Checking of the password, you could do this with a function something like this.

<script>
function checkPassword(theForm)
{
if (theForm.firstPassword && theForm.repeatPassword)
{
if (theForm.firstPassword!= theForm.repeatPassword)
{
error = "The passwords you entered do not match";
}
else if (theForm.firstPassword.lenth < 6 ¦¦ theForm.firstPassword.lenth > 8)
{
error = "The password you have entered must be between 6 - 8 characters.";
}
}
else
{
error = "Please enter both password fields";
}

if (error)
{
alert(error);
return false;
}
else
return true;
}
</script>

This would be efficient enough to check the password.

I haven't tested the second part of the code, but it should work =)

I hope i have helped a little and made a little sence.

Thank you.

Del

phranque

11:01 pm on Feb 12, 2007 (gmt 0)

WebmasterWorld Administrator 10+ Year Member Top Contributors Of The Month



nice job, del!