AJAX و پایگاه داده (AJAX Database)
اینجا «AJAX پایگاه داده» یعنی گرفتن داده زنده، بدون رفرش کامل. «AJAX» مخفف JavaScript و XML غیرهمزمان است. یعنی صفحه منتظر نمی ماند. فقط بخش هدف آپدیت می شود. مثل وقتی فقط کارت دانش آموزی را تازه می کنی، نه کل سایت.
نمونه AJAX با MySQL
در منبع، کاربر از یک منوی کشویی فردی را انتخاب می کند. رویداد onchange اجرا می شود. سپس با XMLHttpRequest به فایل PHP می رویم. پاسخ، جدول HTML است و در #txtHint نمایش داده می شود.
کد سمت سرور: family.php
این PHP به پایگاه داده وصل می شود. سپس بر اساس q، یک ردیف را می خواند. در پایان، جدول HTML می سازد و برمی گرداند.
<?php
$q = intval($_GET['q']);
$con = mysqli_connect('localhost', 'peter', 'abc123');
if (!$con) {
die('Could not connect: ' . mysqli_error($con));
}
mysqli_select_db($con, 'ajax_demo');
$sql = "SELECT * FROM user WHERE id = '" . $q . "'";
$result = mysqli_query($con, $sql);
echo "<table>\n";
echo "<tr>\n";
echo "<th>Firstname</th>\n";
echo "<th>Lastname</th>\n";
echo "<th>Age</th>\n";
echo "<th>Hometown</th>\n";
echo "<th>Job</th>\n";
echo "</tr>\n";
while ($row = mysqli_fetch_array($result)) {
echo "<tr>\n";
echo "<td>" . $row['FirstName'] . "</td>\n";
echo "<td>" . $row['LastName'] . "</td>\n";
echo "<td>" . $row['Age'] . "</td>\n";
echo "<td>" . $row['Hometown'] . "</td>\n";
echo "<td>" . $row['Job'] . "</td>\n";
echo "</tr>\n";
}
echo "</table>";
mysqli_close($con);
گام های عملی
- پایگاه داده و جدول نمونه را بساز.
- فایل family.php را در سرور قرار بده.
- صفحه HTML با منوی کشویی آماده کن.
- رویداد onchange را به تابع فراخوان وصل کن.
- پاسخ را در #txtHint نمایش بده.
نکته: اگر گزینه خالی باشد، خروجی را پاک کن. سپس تابع تمام می شود.
جمع بندی سریع
- AJAX پایگاه داده فقط بخش هدف را تازه می کند.
- رویداد onchange درخواست را می فرستد.
- PHP جدول HTML را برمی گرداند.
- نتیجه در #txtHint قرار می گیرد.
- نمونه زنده در Tryit موجود است.