Tablo satırları otomatik olarak kaydırılmıyor. Komut dosyası 1 kaydırır, komut 2 kaydırmaz. Niye ya?

Question

İlk sorumu sildim ve daha fazla ayrıntı ve jSfiddle domos ekleyerek tekrar yazdım.

Bir sorguyu çalıştıran ve daha sonra bir tabloyu dolduran veri döndüren bir komut dosyası var. Tablolardaki satırlar otomatik olarak bir döngüde kaydırır. Bütün bunlar iyi çalışır ve aşağıdaki kodu kullanarak yapılır. Bununla birlikte, yapmam gereken şey, aynı sayfayı, tam sayfayı yenilemek zorunda kalmadan otomatik ekran güncellemelerini etkinleştiren bir JSON çağrısından görüntülemektir. Bu SCRIPT 2 çalışan var, ama ne işe alınamıyor SCRIPT 1 yılında çalışır otomatik kaydırma olduğunu.

SCRIPT 1: BU şimdi dinamik tablo oluşturmak için bir JSON çağrısıyla yeniden ayarlanmış verilerini kullanmak istediğiniz

https://jsfiddle.net/Blackbox/b2dv6w3w/11/

<table id='table_scroll'> 
<section id="section"> 
do { 
<div class='container'> 
    <div class='clientname-text'><?php echo $row_conf['ClientName'];?></div> 
    <div class='roomname-text'><?php echo $row_conf['RoomName'];?></div> 
    <div class='time-text'><?php echo date("H:i", strtotime($row_conf['RoomFromTime'])) . " - " . date("H:i", strtotime($row_conf['RoomToTime']));?></div> 
</div> 
} while ($row_conf = mysqli_fetch_assoc($conf)); 
</section> 
</table> 


$.fn.infiniteScrollUp=function(){ 
    var self=this,conf=self.children() 
    setInterval(function(){ 
    conf.slice(10).hide(); 
     conf.filter(':hidden').eq(0).slideDown() 
     conf.eq(0).slideUp(6000, "linear",function(){ 
     $(this).appendTo(self); 
    conf=self.children(); 
     }); 
    },100) 
    return this; 
} 


$(function(){ 
    $('section').infiniteScrollUp() 
}) 

İŞLERİ. Bunu şu kodu kullanarak zaten yaptım.

SCRIPT 2BU K wor yok, herkes neden görebiliyor musunuz?

<table id='table_scroll'> 
<section id="section"></section> 
</table> 

$(document).ready(function() { 
    function get_data() { 
     $.getJSON("get_data_logos.php", function(json){ 
      json = json[0].data; 
      var tr ; 
      $('table').html(""); 
      for (var i = 0; i < json.length; i++) { 
       tr = $('<tr/>'); 
       tr.css("border-bottom","2px solid #FFF"); 
       tr.append("<td width='33%'><div class='clientname-text'>" + json[i].ClientName + "</div></td>"); 
       tr.append("<td width='33%'><div class='roomname-text'>" + json[i].RoomName + "</div></td>"); 
       tr.append("<td width='33%'><div class='time-text'>" + json[i].RoomFromTime + " - " + json[i].RoomToTime + "</div></td>"); 
       $('table').append(tr); 
      } 
     }); 
    } 
get_data(); 
setInterval(get_data,60000) 
}); 

$.fn.infiniteScrollUp=function(){ 
    var self=this,conf=self.children() 
    setInterval(function(){ 
    conf.slice(10).hide(); 
     conf.filter(':hidden').eq(0).slideDown() 
     conf.eq(0).slideUp(6000, "linear",function(){ 
     $(this).appendTo(self); 
    conf=self.children(); 
     }); 
    },100) 
    return this; 
} 


$(function(){ 
    $('section').infiniteScrollUp() 
}) 

Sorum şu: Ben zaman için önceden, çok teşekkürler

Yine

https://jsfiddle.net/Blackbox/dsm3dg55/30/

SCRIPT 1'de olduğu gibi SCRIPT 2 kaydırma ile çalışmak için nasıl caan.

Answer 1

Buraya, gönderdiğiniz tüm parçacıklardan herhangi birini kullanmıyorsunuz. ve getdata()'unuz herhangi bir yerde tanımlanmamıştır.

Ben HTML içine kod kalanını JSON nesnesini dönüştürmek için oldu yaptığımız tüm bakir kalır: https://jsfiddle.net/5k9wk6vj/

$(function(){ 

    let $section = $('section'); 
    let clients = json[0].data; 

    //json to html 
    $.each(clients, function (key, client) { 
    $section.append(
     "<div class='container'>" + 
     "<div class='clientname-text'>" + client.ClientName + "</div>" + 
     "<div class='roomname-text'>" + client.RoomName + "</div>" + 
     "<div class='time-text'>" + client.RoomFromTime + " - " + client.RoomToTime + "</div>" + 
     "</div>"); 
    }); 

    //start scrolling 
    $section.infiniteScrollUp(); 
}) 

şansını HTML HTML şablonları ya da birlikte temizleyici inşa edilebilir ama bu çalışması gerekir.