Дублируется вывод в javascript почему?

Question

[Дмитрий Кузьмин]

Есть вывод из JSON (JSON формируется в PHP), стоит таймаут . При обновлении по timeout данные почему то дублируются, а не обновляются . В результате бесконечно вываливаются данные по циклу.
Код:
<ul></ul>

$(document).ready(function(){
			$.ajaxSetup ({  
        cache: false  
    }); 
	setTimeout(getData, 5000);
	});

		
                /* call the php that has the php array which is json_encoded */
				function getData(){
                $.getJSON('api.php', function(data) {
                        /* data will hold the php array as a javascript object */
                        $.each(data, function(key, val) {
                                $('ul').append('<li id="' + key + '">' + val.date + ' ' + val.event + ' ' + val.region + ' ' + val.host + ' '+ val.type + ' ' + val.info + '</li>');
						});
						setTimeout(getData, 5000);
						});
						}

Вывод результата:

2016-09-09 09:12:18 WARN SZ SIU05 [main] Started, locked port 7075
2016-09-09 09:37:03 WARN SZ SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN SZ SIU05 [main] Started, locked port 7075
2016-09-09 09:37:03 WARN SZ SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
I need without doubles:

2016-09-09 09:12:18 WARN SZ SIU05 [main] Started, locked port 7075

2016-09-09 09:37:03 WARN SZ SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

Нужно только обновление, т. е в итоге должно быть:

2016-09-09 09:12:18 WARN SZ SIU05 [main] Started, locked port 7075
2016-09-09 09:37:03 WARN SZ SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075

Вывод из api.php

[{"date":"2016-09-09 09:12:18","event":"WARN ","region":"SZ","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:37:03","event":"WARN ","region":"SZ","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"},{"date":"2016-09-09 09:12:18","event":"WARN ","region":"MRP","host":"SIU05","type":"[main]","info":"Started, locked port 7075"}]

Answer 1

[Антон Хмыров]

У вас в коде только добавление новых элементов в список, а следовательно старые не удаляются. попробуйте вставить между $.getJSON('api.php', function(data) { и $.each(data, function(key, val) команду очищения списка:
$('ul').empty();
Должно получиться так:

function getData(){
                $.getJSON('api.php', function(data) {
                        $('ul').empty();
                        /* data will hold the php array as a javascript object */
                        $.each(data, function(key, val) {
                                $('ul').append('<li id="' + key + '">' + val.date + ' ' + val.event + ' ' + val.region + ' ' + val.host + ' '+ val.type + ' ' + val.info + '</li>');
            });
            setTimeout(getData, 5000);
            });
            }

Comments

[Дмитрий Кузьмин]

Точно. Так заработал. Спасибо Антон!

[Brother79Mail]

ну или вместо append используй html, чтобы не добавить а заменить