Перезагрузите данные AJAX каждые X минут / секунд, jQuery

Question

Я запрограммировал CMS, в которой есть журнал тех, кто недавно вошел в систему. В настоящее время эти данные передаются на вкладку jQuery UI через Ajax. Я хотел бы поместить эту информацию в боковую панель на главной странице и загружать ее через AJAX каждые 30 секунд (или через определенный промежуток времени).

Как бы я поступил так? Нужно ли код PHP кодировать в JSON? Я довольно новичок в данных AJAX и JSON.

Вот PHP, который я сейчас использую, чтобы получить информацию из таблицы пользователей-

<?php
$loginLog = $db->query("SELECT name_f, name_l, DATE_FORMAT(lastLogin, '%a, %b %D, %Y %h:%i %p') AS lastLogin FROM user_control ORDER BY lastLogin ASC LIMIT 10");
while ($recentLogin = $loginLog->fetch()) {
echo $recentLogin['name_f'] . " " . $recentLogin['name_l'] . " - " . $recentLogin['lastLogin'];
}
?>

Спасибо! UPDATE

Хорошо, это то, что у меня есть до сих пор ... часть, на которой я застрял, - это как пройти через JSON и ввести его в поле. Он работает нормально, если я использую только один результат и уверяю, что его нет в []. Я просто изучаю Ajax и JSON, по некоторым причинам это не так легко для меня.

Javascript -

$(document).ready(function(){

                function refreshUsers(){

                    $.getJSON('json.php', function(data) {

                            for (var i = 0; i < data.length; i++) {

                                $("#loadHere").html('<p>' + data.name + ' ' + data.lastLogin + '</p>');

                            }

                });

            }

                var refreshInterval = setInterval(refreshUsers, 30 * 1000);

                refreshUsers();

            });

Что выводит мой PHP-скрипт -

[{"name":"Joe Smith","lastLogin":"Fri, May 21st, 2010 08:07 AM"},{"name":"Jane Doe","lastLogin":"Fri, May 21st, 2010 07:07 AM"}]

Спасибо!

Answer 1

PHP сторона, используйте json_encode () .

Клиентская сторона, используйте $. GetJSON () :

function refreshUsers(){
  $.getJSON(url, postData, function (data, textStatus){
    // Do something with the data
  });
}

// Keep interval in a variable in case you want to cancel it later.
var refreshInterval = setInterval(refreshUsers, 30 * 1000);

С этими двумя у вас должно быть много для начала. Более того, вы бы попросили нас работать на вас:)

Answer 2

Самый простой способ (является ли его субъективный лучший способ - для случая использования, который вы представили, я бы сказал, что он в порядке) состоит в следующем:

var updateInterval = setInterval(function() {
  $('#whereIWantToDisplayIt').load('/thePathToThatScript.php');
},30*1000);

Каждые 30 секунд это будет загружать выходные данные вашего PHP-скрипта и помещать эти выходные данные в элемент с ID = whereIWantToDisplayIt

Я предпочитаю ответ Себа.