AJAX Username Check

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
timWebUK
Forum Contributor
Posts: 239
Joined: Thu Oct 29, 2009 6:48 am
Location: UK

AJAX Username Check

Post by timWebUK »

Hi,

Have been scratching my head over this for an hour or so. I have a dynamic check that will tell the user registering if the username they have entered is already being used (before they submit the form). However, I cannot at all get it to run the Javascript function I have written. Any suggestions would be great. Here is the HTML form:

Code: Select all

 
<html>
    <head>
        <script type="text/javascript" src="scripts/formAjax.js"></script>
        <title>Register</title>
    </head>
    <body onLoad="generateAuthToken();">
    
    
    
        <form method="POST" action="functions/addUser.php" name="frmRegister" >     
            Username:<input type="text" name="strUsername" maxlength="15" size="20" onkeyup="checkUsername(this.value)" /><span id="strCheckResult">Check here</span><br /> 
            Display Name:<input type="text" name="strDisplayName" maxlength="15" size="20" /><br />             
            Email:<input type="text" name="strEmail" /><br />   
            Password:<input type="password" name="strPassword" /><br /> 
            Confirm Password:<input type="password" name="strPasswordConfirm" /><br />  
            Please enter the text below:<input type="text" name="strCaptcha" maxlength="6" /><br />         
            <img src="functions/createCaptcha.php" border="0" /><br />          
            <input type="hidden" name="formToken" value="" /><br />             
            <input type="submit" name="registerUser" value="Register" />    
        </form>
    </body>
</html>
 
As you can see, I have an 'onkeyup' in my username input tag.

This fails to call the function within the external JS file. Here is the JS function:

Code: Select all

 
//Check username isn't taken
    function checkUsername(str)
    {
        xmlHTTP = GetXmlHttpObject();
        if (xmlHTTP == null)
        {
            return;
        }
        var requestURL = "includes/checkUsername.php";
        requestURL = requestURL + "?usr=" + str;
        requestURL = requestURL + "?sid=" + Math.random();
        xmlHTTP.onreadystatechange = function()
        {
            if(xmlHTTP.readyState == 4)
            {
                document.getElementById("strCheckResult").innerHTML = xmlHTTP.responseText;
            }
        }
        xmlHTTP.open("GET", url, true);
        xmlHTTP.send(null);
        
    }
 
GetXmlHttpObject() works fine, and xmlHTTP is declared globally. Have I missed anything at all? I know it isn't being called because when I placed an alert() in there, it was never displayed. However, my AJAX that generates a dynamic token for the form works absolutely fine...
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: AJAX Username Check

Post by kaszu »

Try calling checkUsername('something') in firebug command line and see if it's executed correctly.

Also ?usr=...?sid=... is not correct, correct is ?usd=...&sid=...

Code: Select all

        requestURL = requestURL + "?usr=" + str;
         requestURL = requestURL + "&sid=" + Math.random();  //was "?sid="
User avatar
timWebUK
Forum Contributor
Posts: 239
Joined: Thu Oct 29, 2009 6:48 am
Location: UK

Re: AJAX Username Check

Post by timWebUK »

I'll try that thanks! Ah, the &, completely forgot about that.
User avatar
timWebUK
Forum Contributor
Posts: 239
Joined: Thu Oct 29, 2009 6:48 am
Location: UK

Re: AJAX Username Check

Post by timWebUK »

Made that change, then after doing some more final checks, I realised I had an inconsistency with a variable name!

It's all working now. Cheers.
Post Reply