تخفیف

سبد خرید

نمایش خلاصه ای از خرید هایی که شما انجام خواهید داد

مبلغ کل
0
تسویه حساب
سبد خرید خالی می باشد

آموزش Ajax – قسمت دوم
حميد  شریفی
حميد شریفی
تعداد کل دانلود ها : 734392
تعداد کل مطالب : 1350

آموزش Ajax – قسمت دوم

تعداد دانلود:
0
تعداد بازدید:
2510
تاریخ:
۱۳۹۵-۱۱-۲۵
دسته بندی:

هشتگ ها :

#

خاصیت  responsetext

 

داده های بازگشت داده شده از سرور، می توانند باخاصیت  responsetext بازیابی شوند .

در کدهایمان ،ما مقدار فیلد ورودی “زمان” را برابر با متن پاسخ قرار می دهیم.

xmlHttp.onreadystatechange=function()
{
if(xmlHttp.readyState==4)
  {
  document.myForm.time.value=xmlHttp.responseText;
  }
 
}

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

 

Ajax-فرستادن یک تقاضا به سرور

 

برای ارسال خاموش یک تقاضا به  سرور ما متد open() و متد send() را استفاده می کنیم.

متد open() سه آرگومان دارد. آرگومان اول مشخص می کند کدام متد را هنگام ارسال تقاضا استفاده کنیم (  get یاpost ).

آرگومان دوم مسیر متن طرف سرور را مشخص می کند.

آرگومان سوم مشخص می کند که تقاضا باید به طور غیر همزمان نگه داشته شود.

متد send تقاضاهای خاموش را به سرور ارسال می کند . اگر ما فرض کنیم که فایل های html,asp درهمان مسیر هستند کدها باید به صورت زیر باشند.

xmlHttp.open("GET","time.asp",true);
 
xmlHttp.send(null);
 

اکنون ما باید تصمیم بگیریم زمانی که تابع باید اجرا شود.

ما اجازه می دهیم که تابع در پشت صحنه اجرا شود وقتی که کاربر چیزهایی را در فیلد متن نام کاربری تایپ می کند.

<form name="myForm">
 
Name: <input type="text"
 
onkeyup="ajaxFunction();" name="username" />
 
Time: <input type="text" name="time" />
 
</form>

ما فایل فقط خواندنی ajax””test ajax.htm که فایل نمونه ای زیر است رابه روز کرده ایم.

<html>
<body>
 
<script type="text/javascript">
function ajaxFunction()
 
{
var xmlHttp;
 
try
 
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
 
catch (e)
 
 {
 // Internet Explorer
 try
 
 {
 xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
 }
 
 catch (e)
 
 {
 try
 
 {
 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 
 catch (e)
 
 {
 alert("Your browser does not support AJAX!");
 return false;
 }
 }
 }
 
 xmlHttp.onreadystatechange=function()
 
 {
 
 if(xmlHttp.readyState==4)
 
 {
 
 document.myForm.time.value=xmlHttp.responseText;
 
 }
 
 }
 
 xmlHttp.open("GET","time.asp",true);
 
 xmlHttp.send(null);
 }
</script>
 
<form name="myForm">
 
Name: <input type="text"
 
onkeyup="ajaxFunction();" name="username" />
 
Time: <input type="text" name="time" />
 
</form>
 
</body>
 
</html>

فصل بعد کاربردهای  ajax ما را با script ،time.asp  کامل می کند.

 

کدهای منبع ajax  برای مثال پیشنهادی
کدهای منبع زیر به مثال ajax صفحه قبل متعلق هستند.

شما می توانید آن ها را کپی و پیست کنید وخودتان آن ها را امتحان کنید.

 

صفحه html ajax

این صفحه html است و شامل یک فرم html ساده ویک پیوند به javascript  است.

<html>
<head>
<script src="/clienthint.js"></script> 
</head>
<body>
<form> 
First Name:
<input type="text" id="txt1"
onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p> 
</body>
 
</html>

کد javascriptدرزیر لیست شده است.

Javascript در ajax (جاواسکریپت در ای‌جکس)

 

این کد javascript  در فایل “clienthint” ذخیره شده است:

var xmlHttp
function showHint(str)
{
if (str.length==0)
  { 
  document.getElementById("txtHint").innerHTML="";
  return;
  }
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
  {
  alert ("Your browser does not support AJAX!");
  return;
  } 
var url="gethint.asp";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
} 
 
function stateChanged() 
{ 
if (xmlHttp.readyState==4)
{ 
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
}
}
 
function GetXmlHttpObject()
{
var xmlHttp=null;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
return xmlHttp;
 
}
 

صفحه سرور  ajax- asp و php

چیزی به عنوان سرور ajax وجود ندارد.

صفحات ajax می توانند به وسیله هر سرور اینترنتی سرویس داده شوند.

صفحه سرور نام گذاری شده به وسیله javascript درفرم مثال فصل قبل یک فایل asp ساده است که “gethint.asp” نامیده می شود.

درزیر ما دو مثال لیست شده ازکد صفحه سرورداریم که یکی در asp و یکی در  php نوشته شده است.

مثال ajax در asp

کد درون صفحه” “gethint.aspدر vbscript برای یک سرور اطلاعات نوشته شده است.

فقط یک آرایه ای از اسم ها را چک می کند و نام های مطابقت داده شده،متناسب با مشتری را بر می گرداند.

<%
response.expires=-1
dim a(30)
'Fill up array with names
a(1)="Anna"
a(2)="Brittany"
a(3)="Cinderella"
a(4)="Diana"
a(5)="Eva"
a(6)="Fiona"
a(7)="Gunda"
a(8)="Hege"
a(9)="Inga"
a(10)="Johanna"
a(11)="Kitty"
a(12)="Linda"
a(13)="Nina"
a(14)="Ophelia"
a(15)="Petunia"
a(16)="Amanda"
a(17)="Raquel"
a(18)="Cindy"
a(19)="Doris"
a(20)="Eve"
a(21)="Evita"
a(22)="Sunniva"
a(23)="Tove"
a(24)="Unni"
a(25)="Violet"
a(26)="Liza"
a(27)="Elizabeth"
a(28)="Ellen"
a(29)="Wenche"
a(30)="Vicky"
'get the q parameter from URL
q=ucase(request.querystring("q"))
'lookup all hints from array if length of q>0
if len(q)>0 then
  hint=""
  for i=1 to 30
    if q=ucase(mid(a(i),1,len(q))) then
      if hint="" then
        hint=a(i)
      else
        hint=hint & " , " & a(i)
      end if
    end if
  next
end if
'Output "no suggestion" if no hint were found
'or output the correct values
if hint="" then 
  response.write("no suggestion")
else
  response.write(hint)
end if
 
%>

مثال php در ajax

کد بالا دوباره درphp  نوشته شده است.

نکته: برای اجرای کامل مثال در php، تغییرمقادیر آدرس “clienthint.js”را از “gethint.asp”به”gethint.php” به خاطر بسپارید.

مثال php

<?php
header("Cache-Control: no-cache, must-revalidate");
 // Date in the past
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
 
// Fill up array with names
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hege";
$a[]="Inga";
$a[]="Johanna";
$a[]="Kitty";
$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tove";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";
//get the q parameter from URL
$q=$_GET["q"];
//lookup all hints from array if length of q>0
if (strlen($q) > 0)
{
  $hint="";
  for($i=0; $i<count($a); $i++)
  {
  if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
    {
    if ($hint=="")
      {
      $hint=$a[$i];
      }
    else
      {
      $hint=$hint." , ".$a[$i];
      }
    }
  }
}
 
// Set output to "no suggestion" if no hint were found
// or to the correct values
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}
 
//output the response
echo $response;
 
?>

امیدواریم این مطلب براتون مفید بوده باشه... ملت وب

مشاهده قسمت های قبل:

قسمت اول 

محصولات مشابه فروشی
هشتگ ها :

این محصول بدون نظر می باشد شما میتوانید اولین نظر را ثبت کنید

ارسال نظر

آخرین های مشابه مشاهده بیشتر

  • تلفن : 04136383693
  • پیامک : 500020606688
  • آدرس : آذربایجان شرقی، تبریز، شهرک مصلی، خیابان راجی، راجی 4، کوچه بیست هشتم، قطعه 1339، طبقه چهارم

ملت وب در سال 1393 فعالیت خود را در چهار بخش قالب های آماده، طراحی لوگو، طراحی سایت، طراحی بنر آغاز کرده است، که در مدت بسیار کم با تلاش های بی وقفه خود و همکاران توانسته بزرگترین وب سایت ارائه دهنده قالب های با کیفیت در ایران باشد رمز موفقیت شرکت ملت وب پشتیبانی بی دریغ از کاربران خود می باشد ما موقعیت خود را مدیون مشتریان وفادار خود هستیم پس همیشه همراهشان خواهیم بود .

  • logo-samandehi