Обновление таблицы AJAX с помощью JQUERY

Я хочу обновить таблицу, заполненную данными JSON, например каждые 5 секунд.Обновление таблицы AJAX с помощью JQUERY

Стол должен быть обновлен без обновления сайта. Должны быть добавлены новые элементы, потерянные элементы должны быть удалены. Как обновить его сейчас с помощью AJAX?

<!DOCTYPE html> 
<html> 
<head> 
<title>test</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>  
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<table face="comic sans ms" border="1" id="usertable"></table> 
</head> 
<body> 
<script type="text/javascript"> 
$(document).ready(function(){ 
     $.getJSON('./url.php', function(data) { 
      var cars = data.rec.vehicles.vehicles; 
      $.each(cars, function(key, data){ 
       console.log(data.carName); 
       var vint=data.vin; 
       var coopers=""; 
       var tanken=""; 
       var drive="MAN"; 
       var fuelfarbe="#01DF3A"; 
       var prozent="%"; 
       var v=vint.substring(3,7); 
       if(v=="SX31"){coopers=" S";} 
       if(v=="SW71"){coopers=" SD";} 
       if(data.auto=="Y"){drive="AUT";} 
       if(data.fuelState<=25){tanken="20 Freiminuten für Vollbetankung"; fuelfarbe="#FF4000";} 
       $('#usertable').append(
        function() { 
         return "<tr>"+ 
            "<td>"+data.carName+"</td>"+ 
            "<td>"+data.model+coopers+"</td>"+ 
            "<td>"+drive+"</td>"+ 
            "<td>"+data.fuelState+prozent+"</td>"+ 
            //"<td>"+data.address+"</td>"+ 
            "<td>"+data.licensePlate+"</td>"+ 
            "<td>"+tanken+"</td>" 
           "<tr>"; 
        } 
       ); 
      }) 
     }); 
    }); 
</script> 
</body> 
</html>

источник

2013-11-20 user2718017

попробуйте использовать [window.setInterval] (https://developer.mozilla.org/ ru-US/docs/Web/API/Window.setInterval) –

Я бы настоятельно рекомендовал вам изучить что-то вроде Kno ckout для чего-то подобного. В противном случае вы вытащите свои волосы, когда придет время внести изменения. http://knockoutjs.com – ShaneBlake

Держите getJSON в функции

function dummy() 
{ 
    $(function() { 
     $.getJSON(
     "url", 
     function(json){ }); 
    }); 
}

дают

setInterval(dummy, 5000);

источник

2013-11-20 15:08:15

ОК, я попробовал это сейчас. Проблема в настоящее время: содержимое таблиц добавляется в таблицу extisting ... что случилось ' //..// <тип скрипта = "текст/JavaScript"> $ (документ) .ready (функция() { функция callJSON() { SetTimeout (функция() {$ .getJSON ('./ url.php', функция (данные) { вар авто = data.rec .hachi. $ .each (автомобили, функция (ключ, данные) { //..// } ) }) }). Всегда (callJSON); \t}, 5000); \t} \t $ (callJSON); }); ' – user2718017

Sry :) .. iam кровавый начинающий ... что нужно изменить на мой вышеупомянутый код? Спасибо :) – user2718017

Простой при каждом запросе ajax вы очищаете таблицу, используя 'empty', а затем заполняете ее новыми данными. –

Обновление таблицы AJAX с помощью JQUERY

ответ

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