I have a problem with this code :
<!DOCTYPE HTML>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
(function update() {
$.ajax({
type: 'GET',
url: "http://192.168.4.2/home/api/stato/ambiente/living",
dataType: "json",
success: renderList
}).then(function() {
setTimeout(update, 200);
});
})();
function renderList(data) {
var list = data == null ? [] : (data instanceof Array ? data : [data]);
$.each(list, function(index, data) {
if (data.stato ==1) {
$('#statoList').append('<div>'+ data.ID + " " + data.descrizione + " <img src=img/lamp_on.png " + '</div>');
$('#Switch').append('<button type="button">' + " OFF " + '</button>');
}
else {
$('#statoList').append('<div>'+ data.ID + " " + data.descrizione + " <img src=img/lamp_off.png " + '</div>');
$('#Switch').append('<button type="button">' + " ON " + '</button>');
}
});
}
</script>
</head>
<body>
<div id="statoList"></div>
<div id="Switch"></div>
</body>
</html>
I wish to execute a DIV refresh every 200 ms but the problem is that each time creates a new DIV below the previous one.
How can I solve this?
Thank you.
Aucun commentaire:
Enregistrer un commentaire