از اینکه یک شی XMLHttpRequest را ساخته و به وسیله آن درخواست خود را به سرور ارسال نمودید ، سرور دستورات برنامه Ajax تعیین شده را پردازش کرده و یک خروجی را به عنوان پاسخ درخواست ، به کاربر ارسال می کند .
مرورگر در کامپیوتر کاربر این پاسخ را دریافت کرده و تغییرات لازم را در صفحه و بخش مربوطه انجام خواهد داد .

به وسیله قابلیت Respone در ایجکس ، می توانید کدی طراحی نمایید تا مرورگر پاسخ سرور را دریافت کند . برای این منظور از ۲ خاصیت شی XMLHttpRequest به شرح زیر استفاده می شود :

  • خاصیت responseText : از این خاصیت در زمانی استفاده می شود که پاسخ سرور به صورت یک متن خالی از نوع داده ای string است .
    برای مثال فرض کنید که محتوای یک عنصر پاراگراف باید با متن جدید جایگزین شود . در این حالت چون جواب سرور از نوع متن است ، از خاصیت responseText استفاده می شود .
  • خاصیت responseXML : این خاصیت در زمانی استفاده می شود که پاسخ سرور به صورت یک فایل XML بوده و یا قالب بندی داده ای شده باشد .

در ادامه به تشریح کاربرد این خاصیت ها و مثال استفاده از آنها پرداخته ایم .

</>td

گفتیم زمانی که پاسخ سرور به اسکریپت و یا فایل درخواستی ایجکس ، به صورت متن ساده باشد ، از خاصیت responseText شی XMLHttpRequest ، برای دریافت پاسخ استفاده می شود . سپس شما می توانید این خاصیت را به صورت مستقیم در کد خود به کار ببرید .

مثال : در مثال زیر ابتدا یک شی XMLHttpRequest به نام xmlhttp ساخته شده است . سپس درخواستی به سرور برای باز کردن فایل ajax_ex1.txt و استخراج متن درون آن فرستاده شده است . سپس جواب خروجی از سرور به وسیله خاصیت responseText دریافت شده و با متن موجود در تگ < div id =”ex_1″ > جایگزین شده است .

 

 < html >
< head >
< script type=”text/javascript”>
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest( ) }
else
{
// code for IE6, IE5
xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”) ;
}
xmlhttp.onreadystatechange = function ( )
{
if ( xmlhttp.readyState == 4  &&  xmlhttp.status == 200 )
{
document.getElementById(” ex_1 “).innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open(“GET”, “ajax_ex1.txt”, true);
xmlhttp.send();
}
</script>
< /head >
< body >
< div id = ” ex_1 ” > برای تغییر متن به وسیله ajax بر روی دکمه زیر کلیک نمایید   < /div >
< button type=”button” onclick=”loadXMLDoc( )”> تغییر متن < /button >
< /body >
< /html >

استفاده از خاصیت responseXML :

س از ایکنه با دریافت یک پاسخ ساده متنی از سرور آشنا شدید ، حال بایستی یک پاسخ قالب بندی شده  به زبان  XML را  از سرور دریافت کنیم . برای این منظور از خاصیت responsXML شی XMLHttpRequest ، استفاده می کنیم .

در این پروسه ، ابتدا فایل XML خروجی از سرور دریافت شده و خاصیت responseXML آن را پردازش می کند . سپس اطلاعات آن را در اختیار مرورگر قرار می دهد تا در بخش هایی از صفحه که باید تغییر کنند ، استفاده شود .

برای درک بهتر این مسئله یک مثال ساده را برای شما تشریح می کنیم . در این مثال یک فایل XML به نام Book_List.xml داریم که درون آن لیست یک سری کتاب با نام نویسنده و سال انتشار  قرار دارد .  با اجرای دستور  زیر این فایل از سرور توسط شی responseXML دریافت شده و عنوان کتاب ها از بین اطلاعات دریافتی استخراج می شود . سپس تگ < ” div id = ” ex-2″ > ، این عنوان ها را در خروجی نمایش می دهد . برای مشاهده عملیات و خروجی مثال بر رور دکمه فرمان دریافت عنوان ها ، کلیک نمایید .

 < html >
< head >
< script type=”text/javascript”>
function Book()
{
var xmlhttp;
var txt,x,i;
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest( ) }
else
{
// code for IE6, IE5
xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”) ;
}
xmlhttp.onreadystatechange = function ( )
{
if ( xmlhttp.readyState == 4  &&  xmlhttp.status == 200 )
{
xmlDoc = xmlhttp.responseXM L;
txt = ”  “;
x = xmlDoc.getElementsByTagName ( “TITLE” ) ;
for ( i=0 ; i<x.length ; i++ )
{  txt=txt + x[i].childNodes[0].nodeValue + ” ” ; }
document.getElementById(“ex_2″).innerHTML=txt;
}
xmlhttp.open(” GET ” , “Book_List.xml ” , true ) ;
xmlhttp.send( );
}
</script>
< /head >
< body >
< div id = ” ex_2 ” > < /div >
< button type=”button” onclick=”Book( )”> مشاهده عنوان ها < /button >
< /body >
< /html >