javascript Setinterval prints repeated data from json

Question

Hello i have this code server side to show online users:

header('Content-Type: application/json');
$array = array();
include 'db.php';
$res = mysqli_query($db, "SELECT * FROM `chatters` WHERE status = 1");//users are online
if(mysqli_num_rows($res) > 0){
    while($row = mysqli_fetch_assoc($res)){  
        $array[]= $row;        }
}
echo json_encode($array);

As response i get this:

[{"row_id":"40","name":"Krishan kumar","sex":"male","age":"24","country":"India","seen":"20:58:14", "status": "1"}]

So i on the show page i have this code to show the users:

 $(document).ready(function() {                               
 setInterval(function(){
  $.ajax({
       url: 'json.php',
       dataType: "json",
       type: 'GET',
       success: function(data) {
          if (data) {
            var len = data.length;
            var txt = "";
            for (var i = 0;i<len; i++) {
                txt += "<p>"+data[i].name + "</p>";
            }
            $(".showUsers").append(txt);
            console.log(txt);
          }

       }
    });
  }, 2000);
 });

But the problem is in every 2 second i get name printed like this:

Krishan kumar
Krishan kumar
Krishan kumar
Krishan kumar

and it continues.... I want to show the users name printed only one time while still opening the request with setinterval() to check if new users are online. How to fix this issue?

Above `$(".showUsers").append(txt);` add `$('showUsers').empty();` — Daan, May 04 '15 at 06:55
http://stackoverflow.com/questions/8421998/setinterval-with-loop-time — Saty, May 04 '15 at 06:55
Since, the call is supposed too made just the one time, why not use `setTimeout` — web-nomad, May 04 '15 at 07:00
Hi, @Daan i have added the $('showUsers').empty(); above as you said. But still getting repeated the name. — Saifullah Alam, May 04 '15 at 07:02
@SaifullahAlam You forgot the class selector `.` following should work: `$('.showUsers').empty();` — Daan, May 04 '15 at 07:03
@web-nomad can you share a full answer with setTimeout adjusted with my codes?Thank you — Saifullah Alam, May 04 '15 at 07:05
Ah thank you for a quick fix @Daan I appreciate your help a lot. — Saifullah Alam, May 04 '15 at 07:08
It won't help you here but this is just an idea to improve your app, you should use websocket to update the list in real time — maxime1992, May 04 '15 at 07:41
hello can you send me an example of how to use the web-socket to update the list@Maxime. Thanks — Saifullah Alam, May 04 '15 at 10:35

score 0 · Answer 1 · answered May 04 '15 at 07:38

0

Please clear previous user list before append new list. Use following code

 setInterval(function(){
 $(".showUsers").html('');
 $.ajax({ ....

answered May 04 '15 at 07:38

Santi

620
8
22

javascript Setinterval prints repeated data from json

1 Answers1