تابع onreadystatechange با تغییر وضعیت تابع متناضر با خودش رو فراخونی می کنه .

۵ وضعیت مختلف برای ارسال اطلاعات ممکن است پیش بیاد که عبارتند از صفر=هیچ عملیاتی صورت نگرفته , ۱=درحال بارگذاری ,۲=عملیات بارگذاری به اتمام رسیده ,۳=خاتمه دادن عملیات , ۴=کامل شدن اطلاعات ارسالی

اسم تابع نوشته شده در مقابل تابع onreadystatechange در صورت تغییر هر کدام از این وضعیت ها فراخوانی می شود .

تابع open سه پارامتر می گیره که پارامتر اول نوع ارسال داده ها رو مشخص میکنه پارامتر دوم ادرس صفحه ای رو که می خوایم اطلاعات رو برای اون ارسال کنیم چون در اینجا ما اطلاعات رو به صورت get ارسال می کنیم فیلد user رو هم در url قرار داده و ارسال می کنیم و پارامتر سوم هم نشان دهنده همگام یا ناهمگام بودن فراخوانی است .

مقدار متغییر url در صورتی که هنگام پر کردن فرم مقدار عبارت user رو برابر hossein بدیم مقدار متغییر url برابر با مقدار زیر خواهد بود .

 

 index.php?user=hossein

 

تابع send اگر اطلاعات ارسالی به صورت data وجود داشته باشه از این تابع برای ارسال استفاده می کنیم اما چون ما در اینجا اطلاعات رو به صورت get ارسال کردیم مقدار این تابع رو برابر null قرار میدیم .

تا اینجا کارای هر یک از توابع رو توضیح دادیم و حالا یک بار برنامه رو تا اینجا چک میکنیم .

کاربر وارد سایت میشه اطلاعات خودش رو پر میکنه و برای چک نام کاربری بر روی دکمه check کلیک می کنه در این هنگام ما باید تابع checkUser رو فراخونی کنیم بنابراین دکمه check رو به صورت زیر تغییر میدیم .

 

 <input type="button" value="check"  onclick="checkUser()"/>

 

تابع checkUser فراخونی میشه و در ابتدا یه نمونه از شی XmlHttp ساخته میشه و بعد در صورت درست نشدن این نمونه از شی XmlHttp یک پیام به کاربر نمایش میده و از ادامه اجرای تابع صرف نظر میکنه اما در صورت رد کردن این مرحله و ادامه کار متغییری که تعریف کردیم , ادرس صفحه ای رو که نام کاربری باید به اون ارسال بشه همراه با پارامتر نام کاربریمون در بر میگیره .
توسط تابع open فراخونی مورد نظرمون رو تنظیم می کنیم .در خواست هنگامی ارسال میشه که متد send اجرا بشه و در انتها متد send رو با مقدار null فراخونی کردیم یعنی هیچ مقداری رو به صورت post نمی خوایم ارسال کنیم . در ادامه کار در صورت تغییر هر کدوم از وضعیت ها , تابع stateChanged فراخونی میشه که البته هنوز این تابع رو تعریف نکردیم

حالا تنها کاری که مونده در سمت کلاینت انجام بدیم تابع stateChanged هست که در صورت تغییر وضعیت باید فراخونی بشه .

این تابع رو به صورت زیر تعریف می کنیم .

 

   function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
if (xmlHttp.responseText==1)
{
document.getElementById("user").style.border="1px solid #FF0000";
}
else{
document.getElementById("user").style.border="1px solid #۰۰CC00";
}
}
}

 

متد readyState وضعیت درخواستمون رو نگه داری میکنه در بالا دو حالت مختلف رو ما چک کردیم اول وضعیت ۴ وبعد وضعیت complete در واقع هر دوی این وضعیت ها یکی هستند وبه کامل بودن صفحه اشاره می کنند .

متد responseText هم نتیجه ارسالی از سرور رو بر میگردونه
در سرور اگر نام کاربری وجود داشته باشه قراره مقدار یک و در غیر اینصورت قراره مقدار صفر رو برگردونه بشه , حالا در تابع stateChanged چک میکنیم اگر مقدار برگشتی از سرور برابر یک هست حاشیه جعبه متن مربوط به user رو برابر با قرمز و در غیر اینصورت برابر با سبز قرار میدیم .