2010-05-21 2 views
8

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

Как бы я это сделал? Должен ли PHP-запрос кодироваться JSON? Я довольно новичок в данных AJAX и JSON.

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

<?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"}] 

Спасибо!

ответ

17

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); 

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

+0

Спасибо за помощь! Я обновил свой оригинальный пост тем, что у меня есть. Застрял в попытке пропустить JSON - я новичок в обеих циклах в Javascript/jQuery, Ajax и JSON. Еще раз спасибо! – NightMICU

+0

Рад, что я мог бы помочь! Если это правильный ответ, отметьте как принято, а другие с той же проблемой знают, как его решить. Что касается цикла, помните все, что у вас есть на PHP, и кодируйте, поскольку JSON будет вести себя точно так же с другой стороны: если это был объект ab, вы можете получить доступ к свойствам в JS с помощью оператора '.'; если он был массивом, просто повторите так же, как на почти языке; 'Данные [я]'. Остерегайтесь карт в PHP: они становятся объектами в JSON. – Seb

+0

Хорошо, поэтому мне удалось выяснить, как перебирать данные из JSON и добавлять их в DIV, используя .appendTo(). Но мне нужно просто загрузить результаты из таблицы MySQL и вставить их в боковую панель DIV каждые X секунд. Метод Mailslut на самом деле выглядит лучше для этого - просто прокрутить таблицу с помощью PHP и вставить этот HTML в DIV. Итак, мой вопрос: в чем преимущество JSON против $ .load() для этого приложения? Как я могу использовать JSON и добавлять все результаты из таблицы в DIV, не добавляя их каждый раз? Благодаря! – NightMICU

2

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

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

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

Я предпочитаю ответ Seb все же.

+0

Использование 'load()' означает, что сервер должен знать, как отображать результаты. ИМХО, было бы лучше разделить презентацию и оставить часть HTML на стороне JavaScript. В конце концов, этот HTML-код не будет использоваться, если JS отключен. – Seb

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