2011-12-17 3 views
1

Я создаю веб-сайт, который печатает содержимое в его базе данных Mysql на странице для просмотра пользователем. Содержимое базы данных будет постоянно добавляться, и я хочу показать эти изменения в режиме реального времени на странице без необходимости перезагрузки пользователя. Я использую PHP для эхо-содержимого базы данных на странице прямо сейчас, и она отлично работает, просто чтобы увидеть какие-либо новые изменения, страница должна быть перезагружена. Поэтому мой вопрос: как мне сделать обновление страницы в реальном времени? Я предполагаю, что это привлечет Ajax, но я довольно новичок в javascript ...Изменения в базе данных в реальном времени с помощью Ajax

Не могли бы вы, ребята, указывать мне в правильном направлении?

Вот что моя база данных выглядит следующим образом:

id  author   body 
---------------------------------------- 
1  jim    sample content 
2   bob    more content 
3   fred   some more! 

Я использую следующий код PHP для печати выше данных на веб-странице:

$query = mysql_query("SELECT * FROM log order by id desc") or die(mysql_error()); 
while($row = mysql_fetch_array($query)) : 
    echo $row['author']; 
    echo $row['body']; 
endwhile; 

Спасибо!

+0

http://www.tizag.com/ajaxTutorial/ Показывает, как создать объект AJAX – Drahcir

+0

Я пытаюсь получить контент из базы данных, пока они просто заполняют дату – codedude

+0

, это точно такой же принцип, вместо того, чтобы отправлять дату, вы отправляете обратно любую информацию, которую хотите отобразить. – Drahcir

ответ

3

Если вы хотите использовать библиотеку jQuery, вы можете использовать этот пример, который я написал. Его довольно сложно, но я плохо объясняю, что могу.

<html> 
<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      var shownIds = new Array(); 

      setInterval(function(){ 
       $.get("test2.php", function(data){ 
        data = $.parseJSON(data); 

        for(i = 0; i < data.length; i++){ 
         if($.inArray(data[i]["id"], shownIds) == -1){ 
          $("#log").append("id: " + data[i]["id"] + "<br />"); 
          shownIds.push(data[i]["id"]); 
         } 
        } 
       }); 
      }, 2000); 
     }); 
    </script> 
</head> 
<body> 
    <div id="log"> 

    </div> 
</body> 
</html> 

test2.php

<?php 
$result[0]["id"] = "id1"; 
$result[1]["id"] = "id2"; 

echo json_encode($result); 
?> 

Так в основном, он проверяет, если документ будет готов, и все загружается. После этого создается новый массив, называемый показанными. Эта переменная будет содержать идентификатор (первичный индекс из вашей таблицы sql), чтобы убедиться, что он не показывает одни и те же данные дважды. SetInterval просто вызывает вызов этой функции каждые две секунды. $ .get Эта функция получает источник страницы test2.php, который имеет данные json. Он анализирует его с помощью $ .parseJSON, а затем проходит через каждый из них. Чтобы убедиться, что две строки не показаны дважды, она проверяет с помощью $ .inArray, чтобы увидеть, находится ли идентификатор в показанном массиве. Если это не так, он добавляет данные (только id на данный момент) на единственный div. Затем он выталкивает идентификатор в массив показанных символов, чтобы он снова не отображался.

test2.php делает массив. Устанавливает идентификаторы и эхо-данные в формате json (не требуется, но сохраняет его)

+0

святой коровы ... спасибо за ваш ответ! Дайте мне секунду, чтобы пройти через это. :) – codedude

1

Использовать jquery ajax http://api.jquery.com/jQuery.ajax/ его простой и простой способ вызова ajax через каждую секунду ... так что через каждую секунду u получит новые данные.

Смежные вопросы