با سلام خدمت شما دوستان عزیز
Ajax یک زبان برنامه نویسی نیست ، بلکه ترکیب بین چند زبان برنامه نویسی و اسکریپت نویسی می باشد، حال ما می خواهیم به این بپردازیم که تکنولوژی Ajax چیست و چه فایده ای دارد.
نمی خواهم زیاد توضیح خاصی بدم ، این تکنولوژی ، تکنولوژی که باعث بارگزاری مجدد صفحه سمت بازدید کننده نمی شود بلکه در همان صفحه به تبادل اطلاعات میان بازدید کننده و سرویس دهنده می پردازد و باعث عدم بارگزاری مجدد صفحه سمت بازدید کننده می شود ، حالا این تکنولوژی چه فایده ای خواهد داشت ؟
فایده این تکنولوژی در این است که باعث مصرف بی فایده پهنای باند سایت شما نمی شود و ... ، تا حالا به این فکر کرده اید که در بعضی از سایت ها چگونه مطالب بدون اینکه صفحه مجدد بارگزاری شود ، تغییر می کند. زیاد وارد حاشیه نمی شوم ، در کل این تکنولوژی باعث بارگزاری مجدد صفحه نمی شود و کاربر خیلی زود به هدفش می رسد.
من می خوام امروز یک مثال ساده از این تکنولوژی فوق العاده را به شما آموزش دهم.
قصد ما چیست ؟ قصد ما این است که در یک صفحه چندیدن صفحه مختلف داشته باشیم که با کلیک بر روی لینک هر صفحه بدون بارگزاری مجدد صفحه ،محتویات صفحه کلیک شده را از بانک اطلاعاتی در خواست و برای من نمایش دهد.
حال به سراغ ساخت یک بانک اطلاعاتی MySql می رویم. پس از ساخت بانک اطلاعاتی خود به سراغ ساخت جدول می رویم ، بصورت زیر:
[html]CREATE TABLE `pages` (
`page1` text NOT NULL,
`page2` text NOT NULL,
`page3` text NOT NULL,
`page4` text NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
[/html] پس از ساخت جدول ، اطلاعات زیر را در جدول وارد می کنیم که شامل اطلاعات صفحه 1 تا 4 ما می باشد.
[html]INSERT INTO `pages` VALUES ('Page 1 Information', 'Page 2 Information', 'Page 3 Information', 'Page 4 Information');[/html]
پس از وارد نمودن اطلاعات صفحه ها ، سراغ برنامه نویسی PHP می رویم. این فایل را با اطلاعات زیر با نام db.php ذخیره می نمائیم.
[php]
<?php[/php]
[php]
$pages = $_GET["page"]; // Daryaft Shomareye Page
$dbusername = "root"; // Username DB
$dbpassword = ""; // Password DB
$dbname = "PHPwithAJAX"; // DB Name
$server = "localhost"; // Server Name Ke Mamolan localhost Mibashad
$connect = mysql_connect("$server","$dbusername","$dbpassword ") or die (include "errsql.htm"); // Etesal Be Bank Etelaati Va Dar Sorat Adame Etesal Namayashe errsql.htm Ke Da Root Project Gharar Dadim
$select = mysql_select_db("$dbname") or die (include "errsql.htm"); // Check Nemodan Etelaate bank Etelaati Va Dar Sorat Eshkal Namayeshe errsql.htm
$result = mysql_query("SELECT * FROM pages"); // Gereftan Etellate Page Ha
while($r=mysql_fetch_array($result))
{
$page1=$r["page1"];
$page2=$r["page2"];
$page3=$r["page3"];
$page4=$r["page4"];
}
switch ($pages) { // Tain Namyesh Page Ba Select Case
case 1:
echo "$page1"; // Namayeshe Page 1
break;
case 2:
echo "$page2"; // Namayeshe Page 2
break;
case 3:
echo "$page3"; // Namayeshe Page 3
break;
case 4:
echo "$page4"; // Namayeshe Page 4
break;
}
?>
پس از ساخت db.php به سراغ فایل ajax.js می رویم.
[html]function showPage(page){ // Function Namayeshe Page
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject('Msxml2.XMLHTTP'); // Sakht Motagheiere Lazeme Baraye Ajax
} catch (e) {
try {
xmlhttp = new
ActiveXObject('Microsoft.XMLHTTP'); // Dar Sorat Support Nakardan Motagheier Bala // Sakht Motagheiere Lazeme Baraye Ajax
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest(); // Dar Sorati Ke Yeki Az Motagheir Haye Bala Kar kardan Edame Midahim
}
var file = 'db.php?page='; // Masire File Db Ke Sakhtim Ro Vared Mikonim
xmlhttp.open('GET', file + page, true); // Moshakas Nemodan Nahve Gereftan Etelat Ba Tarif Safheye Mored Nazar
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState == 1) { // Age Dar Hale Barghozari Etelat Bod In Code Htm Faal Beshe Ke Karbar Pasand Tar Bashe Barnamye Ajax Ma
document.getElementById('ShowInfo').innerHTML ='<p align=center><img src=loading.gif border=0><br><br>... در حال بارگزاری</p>'; }
if (xmlhttp.readyState==4) { // Dar Sorat Load Etelaat Bere Baraye Namayesh
var content = xmlhttp.responseText;
if( content ){ //khate 21
document.getElementById('ShowInfo').innerHTML = content; // Namayesh Etelaati Ke Bad Dastor Get Az Server Gereftim in Etelaat Dar Div Ke Dar index.php Khod Sakhtim Ke Name On ShoInfo Bod Namaysh Bede
}
}
}
xmlhttp.send(null) // Laghv Motagheier Dar Akahr
return;
}
[/html][/php] حال به سراغ index.php می رویم البته نیازی به پویا بودن این صفحه نیست ولی ما بصورت PHP در نظر می گیریم.
[html]
<!-- Be In Sorat Be Page Ha Link Midahim javascript:showPage('Shomareye Safhe'); -->[/html]
[html]
<script language='javascript' type='text/javascript' src='ajax.js'></script>
<!-- Barghoxari Ajax File Ke Sakhte Bodim Baghie Ham Ke Asone HTMl Hastan Fekr Nemikonam Tozih Khasi Bekhad -->
<style type="text/css">
<!--
body,td,th {
font-family: Tahoma;
font-size: 8pt;
}
a {
font-family: Tahoma;
font-size: 8pt;
color: #000000;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #000000;
}
a:hover {
text-decoration: none;
color: #FFFFFF;
}
a:active {
text-decoration: none;
color: #FFFFFF;
}
body {
background-color: #E1E1E1;
}
-->
</style>
<center>
<table align="center" valign="center" width="100%" height="100%" border="0">
<tr>
<td align="center" valign="middle"><table width="100%" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" align="center">
<table width="573" height="380" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="19" colspan="5" align="left" valign="middle" bgcolor="#E1E1E1"><a href="http://www.forum.p30world.com"><img src="logo.jpg" width="365" height="84" border="0" title="S@jj@d at Forum.P30WORLD.com" /></a></td>
</tr>
<tr>
<td height="19" align="center" valign="middle" bgcolor="#FFFFFF"> </td>
<td width="65" align="center" valign="middle" bgcolor="#FFFFFF" onmouseover="this.style.background='#000000';" onmouseout="this.style.background='#FFFFFF';"><a href="javascript:showPage('4')">صفحه چهارم </a></td>
<td width="65" align="center" valign="middle" bgcolor="#FFFFFF" onmouseover="this.style.background='#000000';" onmouseout="this.style.background='#FFFFFF';"><a href="javascript:showPage('3')">صفحه سوم </a></td>
<td width="65" align="center" valign="middle" bgcolor="#FFFFFF" onmouseover="this.style.background='#000000';" onmouseout="this.style.background='#FFFFFF';"><a href="javascript:showPage('2')">صفحه دوم </a></td>
<td width="65" align="center" valign="middle" bgcolor="#FFFFFF" onmouseover="this.style.background='#000000';" onmouseout="this.style.background='#FFFFFF';"><a href="javascript:showPage('1')">صفحه اول</a></td>
</tr>
<tr>
<td colspan="5" align="center" valign="middle" bgcolor="#FFFFFF"><div id="ShowInfo">
<p> خوش آمدید MySql با PHP در AJAX به صفحه آموزشی</p>
<p>.کپی برداری از این اثر ، فقط با ذکر منبع پی سی ورلد مجاز می باشد</p>
<p>SajjadSalemi [ S@jj@d ] </p>
</div></td>
</tr>
</table>
<br />
Copyright © 2009 [ S@jj@d ] at <a href="http://www.forum.p30world.com">P30WORLD.com</a>. All Right Reserveds </td>
</tr>
</table>
<center>
[/html] آموزش به پایان رسید ، امیدوارم مورد توجه شما واقع شده باشد. در صورت هرگونه سوال : سوال خود را مطرح کنید تا بنده حقیر در صورت امکان کمکی باشم. :46:S@jj@d
کپی برداری فقط با ذکر منبع پی سی ورلد مجاز می باشد.
تمامی آموزش را بصورت PDF و مثال را بصورت فایل برای دانلود گذاشتم.
لینک دانلود:
کد:
http://rapidshare.com/files/181021408/PHPwithAJAX_P3oworld.com.rar.html
