اگر تمام فصلهای قبلی اموزش اژاکس را بطور کامل خوانده باشید دیگر مشکلی ندارید و من می توانم خیلی سریع فقط با یک اشاره از موارد دیگر بگذرم
 
طراحی فایل 02.php
 

فرض کنید فایلی که ما از سرور می خواهیم یک فایل php  به نام 02.phpباشد

 

1- فایل جدیدی با استفاده از notepad ایجاد کنید

 2-

* در مسیر درایو C پوشه wamp پوشه www

* انتخاب کردن all files از save as type

*فایل را با اسم 02  و پسوند php ذخیره کنید

 

 3- دستورات php زیر را در فایل بنویسید

 

توجه توجه :

عبارتی که می خواهید بعنوان جواب سرور باشد باید با دستور echo مشخص کنید

 

 

در این مثال من می خواهم که  بعد از کلیک روی عبارت show server date  ، تاریخ سرور بجای  کلمه show server date در صفحه test.php نمایش داده شود

 

 محتوای صفحه 02.php

 

 

<?php


echo  date("Y")."/".date("m")."/".date("d");

?>

 

 پارامتر Y :شماره سال بصورت 4 رقمی

پارامتر m : شماره ماه

پارامتر d : شماره روز

 

 
 
طراحی فایل test.html
 حالا صفحه وبی که کاربر می خواهد مشاهده کند ایجاد می کنم
 من می خواهم این صفحه وب یک پیوند را با عنوان show server date نمایش دهد
 

 

در بدنه body دستور زیر را می نویسم :

 

<body>

 

             <a href="#"  id="te"  onclick="sw();"> show server date </a>

 

</body>

 href را برابر # گذاشته ام چون نمی خواهم با کلیک روی پیوند به صفحه دیگری بروم و می خواهم در همین صفحه بمانم

 

اما چون می خواهم با کلیک روی این پیوند دستوراتی انجام شود پس تابع Sw را در رویداد onclick فراخوانی می کنم

 
طراحی تابع sw
 درون تگ head و script تابع sw را بصورت زیر تعریف می کنم

 

function sw()
{



var a;


if (window.XMLHttpRequest)
  {
  a=new XMLHttpRequest();
  }
else
  {
  a=new ActiveXObject("Microsoft.XMLHTTP");
  }





a.onreadystatechange=function()
  {
  if (a.readyState==4 && a.status==200)
    {
   document.getElementById("te").text=a.responseText;
    }
  }


 


 
a.open("GET","02.php",true);
a.send();

 
}


 text : چون من فقط می خواستم متن پیوندی که ای دی ان te است  تغییر کند نه اینکه  مجموعه دستورات html که ممکن است درون ان باشد ( که البته دورن تگa برنامه ای که من نوشته ام تگهای دیگری نیست ) از text استفاده کردم

 برنامه را اجرا کنید

روش اجرا را در فصل موارد لازم گفته ام

 
 
 

 نکته :

برنامه را اجرا کرده اید ، و مشاهده کرده اید که جواب سرور هم بصورت پیوند است زیرا ما تگ A را از بین نبردیم بلکه همان تگ بر قرار است ما فقط متن انرا عوض کردیم

 
 حالا اگر خواسته باشید جواب سرور بصورت پیوند دیده نشود  به روش زیر برنامه را اصلاح کنید :
 

کارهایی که می خواهم انجام دهم به ترتیب اینهاست :

1-  تگ a را دورن یک تگ DIV یا p قرار می دهم

2- ای دی این تگ ها را te می گذارم

3- و می گویم که بعد از کلیک روی محتوای این تگ ، تابع sw فراخوانی شود

4- در تابع Sw مشخص می کنم که جواب سرور به جای محتوای html تگی که ای دی ان te است قرار بگیرد

 
قسمت body برنامه test.html بصورت زیر می شود :

 

<body>


<div id="te" onclick="sw();">

    <a  href="#" > show server date </a>

</div>



</body>

 
در تابع sw ،  دستوری که محتوای بازگشتی از سرور را به جای تگ A در تگ div قرار خواهد داد بصورت زیر خواهد بود :

 

 document.getElementById("te").innerHTML=xmlhttp.responseText;