Hi all,
I am setting up a registration form for a website im building.
When the user enters his/her information i would like to validate that the Username/Email aren't already in use.
At this point in time ive got my mind set on a function that runs 2 seconds after anything is typed into the Textbox.
This function works, it returns "Available" or "In use" when it should.
The problem is;
when the user begins to type, i would like my image (ajax-loader.gif) to appear, and when the script gives a result, i want the image to hide again.
but this only works ONCE.
My Code:
jQuery:
<script type="text/javascript">
$(document).ready(function() {
$("#username").keyup(function(){
$("#loading").show();
setTimeout(function(){
var entered_text = $("#username").val();
validateUsername(entered_text);
$("#loading").hide();
}, 2000);
});
});
function validateUsername(username)
{
$("#username_valid").load("validate_username.php?Username=" + username);
}
</script>
HTML:
<tr><td>Username:</td><td colspan="2"><input id="username" type="text" name="username" /></td><td id="username_valid"><img id="loading" style="display:none;" src="ajax-loader.gif"/></td></tr>
(This is the only line of my HTML code that is relevant to my issue.)
PHP/MySQL:
<?php
$username = $_REQUEST['Username'];
$con = mysql_connect('*******', '******', '*******');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db('users', $con);
$sql_query = mysql_query("SELECT 'username' FROM `users` WHERE `username`='" . $username . "'");
if(mysql_num_rows($sql_query)==1)
{
echo "Sorry this name is already taken!";
}
else
{
echo "This name is available!";
}
?>
I really stuck on this one.
Any help is appreciated.
Cheers, James