Check User Sign Up Name Ajax PHP Social Network Tutorial

Published :
Author :
Adam Khoury
In this lesson you will get a free script example to copy and paste plus a video guide on the programming logic involved to accomplish checking a user's name in your sign up form using a simple Javascript Ajax post to PHP. The PHP will check our mySQL database to see if the username is already taken or not and lets the user know right away while they are filling out your sign up form. <?php if(isset($_POST["name2check"]) && $_POST["name2check"] != ""){ include_once 'my_folder/connect_to_mysql.php'; $username = preg_replace('#[^a-z0-9]#i', '', $_POST['name2check']); $sql_uname_check = mysql_query("SELECT id FROM user_table WHERE user_name='$username' LIMIT 1"); $uname_check = mysql_num_rows($sql_uname_check); if (strlen($username) < 4) { echo '4 - 15 characters please'; exit(); } if (is_numeric($username[0])) { echo 'First character must be a letter'; exit(); } if ($uname_check < 1) { echo '<strong>' . $username . '</strong> is OK'; exit(); } else { echo '<strong>' . $username . '</strong> is taken'; exit(); } } ?> <html> <head> <script> function checkusername(){ var status = document.getElementById("usernamestatus"); var u = document.getElementById("uname").value; if(u != ""){ status.innerHTML = 'checking...'; var hr = new XMLHttpRequest(); hr.open("POST", "name_check_tutorial.php", true); hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); hr.onreadystatechange = function() { if(hr.readyState == 4 && hr.status == 200) { status.innerHTML = hr.responseText; } } var v = "name2check="+u; hr.send(v); } } </script> </head> <body> <input type="text" name="uname" id="uname" onBlur="checkusername()" maxlength="15"> <span id="usernamestatus"></span> </body> </html>