PHP| מדריך בדיקת מישתמש ב AJAX

ClanNoD · 08/04/12, 10:58

מדריך בדיקה האם שם המישתמש פנוי\תפוס בעזרת AJAX

טוב אז היום אני ילמד לעשות מערכת בדיקת שם מישתמש ולהחזיר האם הוא פנוי או תפוס בעזרת AJAX.

יאלה נתחיל.

שלב אחד - יצירת הקבצים
בנו קובץ HTML שיש שם :
1.טופס
2.שדא לשם מישתמש
3.כפתור בדיקה.

שלב שני - קובץ ה JS ו HTML
צרו קובץ בשם AJAX.js וקשרו אותו לדף HTML.
זה ניראה כך:
קוד HTML:

קוד HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="he" dir="rtl">    <head>        <title>מדריך - AJAX</title>        <meta http-equiv="content-type" content="text/html; charset=utf-8" />        <meta name="generator" content="OnlyKid - Rafael Zilberman" />        <meta name="keywords" content="" />        <meta name="description" content="" />                <!-- JavaScript -->            <script type="text/javascript" src="AJAX.js"></script>        <!-- / JavaScript -->    </head>    <body>        <form action="">            <label for="user">שם מישתמש</label><input type="text" name="username" id="user" value="שם מישתמש" /> <input type="button" value="בדוק" /><br />            <div id="error">                            </div>        </form>    </body></html>

לאחר מיכן בקובץ JS שיצרתם כתבו את הקוד הבא:
קוד PHP:

PHP Code:


function showUser(str) 
{ 
var xmlhttp;     
if (str=="") 
  { 
  document.getElementById("txtHint").innerHTML="";//בודק האם הקידו שם מישתמש או לא 
  return; 
  } 
if (window.XMLHttpRequest) 
  {// code for IE7+, Firefox, Chrome, Opera, Safari 
  xmlhttp=new XMLHttpRequest();//יוצר HttpRequest חדש 
  } 
else 
  {// code for IE6, IE5 
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
  } 
xmlhttp.onreadystatechange=function() 
  { 
  if (xmlhttp.readyState==4 && xmlhttp.status==200) //בודק האם הקובץ החזיר תשובה 
    { 
    document.getElementById("error").innerHTML=xmlhttp.responseText;//ממלא את ה DIV במה שהקובץ  החזיר 
    } 
  } 
xmlhttp.open("GET","user.php?u="+str,true);.//שולח ב GET את המידע לקובץ user.php 
xmlhttp.send(); 
}

יש קצת הסברים.

שלב שלישי - הPHP
אוקיי דבר אחרון ה SQL.
דבר ראשון צרו חיבור ל MYSQL:
קוד PHP:

PHP Code:


mysql_connect("localhost", "root", "") or die(mysql_error()); 
mysql_select_db("guides") or die(mysql_error());

לאחר מיכן בידקו אם יש GET["u"]:
קוד PHP:

PHP Code:


if(isset($_GET["u"])) 
{ 
     
}

בתוך ה IF צרו שאילה שתישלוף מהמסד נתונים אח וורק אם username שווה ל get["u"]:
קוד PHP:

PHP Code:


$query = mysql_query("SELECT * FROM users WHERE `username` = '".$_GET["u"]."'");

אחר כך צרו IF שיבדוק האם NUM_ROWS שונה מ 0 - זה אומר ששם המישתמש תפוס.ותעשו גם ELSE:
קוד PHP:

PHP Code:


if(mysql_num_rows($query) != 0) 
        { 
             
        } 
    else 
        { 
             
        }

דבר אחרון הוסיפו למקום המתאים מה אתם רוצים שיוצג במיקרה שה נכון\לא נכון:
קוד PHP:

PHP Code:


if(mysql_num_rows($query) != 0) 
        { 
            echo "שם המישתמש <b>".$_GET["u"]."</b> תפוס"; 
        } 
    else 
        { 
            echo "שם המישתמש <b>".$_GET["u"]."</b> פנוי"; 
        }

שלב רביעי - דבר אחרון
דבר אחרון חביב.
נעשה שבלחיצה אל הכפתור ה יפנה ל FUNCTION שיצרנו:
קוד HTML:

onclick="showUser(user.value)"
קוד מלא
Index.php:
קוד PHP:

קוד HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="he" dir="rtl"> 
    <head> 
        <title>מדריך - AJAX</title> 
        <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
        <meta name="generator" content="OnlyKid - Rafael Zilberman" /> 

        <meta name="keywords" content="" /> 
        <meta name="description" content="" /> 
         
        <!-- JavaScript --> 
            <script type="text/javascript" src="AJAX.js"></script> 
        <!-- / JavaScript --> 
    </head> 
    <body> 
        <form action=""> 
            <label for="user">שם מישתמש</label><input type="text" name="username" id="user" value="שם מישתמש" /> <input type="button" value="בדוק" onclick="showUser(user.value)" /><br /> 
            <div id="error"> 
                 
            </div> 
        </form> 
    </body> 
</html>

AJAX.js:
קוד HTML:

PHP Code:


function showUser(str){var xmlhttp;    if (str=="")  {  document.getElementById("txtHint").innerHTML="";//בודק האם הקידו שם מישתמש או לא  return;  }if (window.XMLHttpRequest)  {// code for IE7+, Firefox, Chrome, Opera, Safari  xmlhttp=new XMLHttpRequest();//יוצר HttpRequest חדש  }else  {// code for IE6, IE5  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");  }xmlhttp.onreadystatechange=function()  {  if (xmlhttp.readyState==4 && xmlhttp.status==200) //בודק האם הקובץ החזיר תשובה    {    document.getElementById("error").innerHTML=xmlhttp.responseText;//ממלא את ה DIV במה שהקובץ  החזיר    }  }xmlhttp.open("GET","user.php?u="+str,true);.//שולח ב GET את המידע לקובץ user.phpxmlhttp.send();}

user.php:
קוד PHP:

PHP Code:


<?php 
mysql_connect("localhost", "root", "") or die(mysql_error()); 
mysql_select_db("guides") or die(mysql_error()); 

if(isset($_GET["u"])) 
{ 
    $query = mysql_query("SELECT * FROM users WHERE `username` = '".$_GET["u"]."'"); 
    if(mysql_num_rows($query) != 0) 
        { 
            echo "שם המישתמש <b>".$_GET["u"]."</b> תפוס"; 
        } 
    else 
        { 
            echo "שם המישתמש <b>".$_GET["u"]."</b> פנוי"; 
        } 
} 
?>

אשכול: PHP| מדריך בדיקת מישתמש ב AJAX