Dinamik içerikle önyükleme sayfalama?

Question

Önyükleme modalımda bir tabloyu sayfalayabilmem gerekir.

Sorun şu ki, tablo satırlarını dinamik olarak oluşturmamdır.

Tablo satırlarını oluşturan kod.

function getValidTags(){ 
    var ruleID = $('.ruleID').val(); 

    $.ajax({ 
    url: '/ajax/getValidTags.php', 
    type: 'POST',   
    data: { 
     ruleID: ruleID, 
    }, 
    }) 
    .done(function(data) {  
    $.each(data, function(validName, afCount) { 
     var newValidRow = '<tr>'+ 
     '<td>'+validName+'</td><td>'+afCount+' Autofixes</td><td><button type="button" class="btn btn-primary btn-sm"><i class="fa fa-cog"></i></button> <button type="button" class="btn btn-danger btn-sm">Delete</button>'+ 
     '</tr>'; 
     $('.validTagsTable').append(newValidRow);   
    }); 
    }) 
} 

nasıl tabloya sayfalama eklerim? Bir sayfa ile 20 tablo satırı sınırlayabilmek ister misiniz?

İşte benim HTML

  <table class="table table-striped table-condensed"> 
      <thead> 
       <tr> 
        <th>Tag Name</th> 
        <th>Autofixes</th> 
        <th>Manage</th> 
       </tr> 
      </thead> 
      <tbody class="validTagsTable"> 
      </tbody>      
     </table> 
     <div class="col-md-4"></div> 
     <div class="col-md-4"> 
      <nav> 
       <ul class="pagination"> 
       <li> 
        <a href="#" aria-label="Previous"> 
        <span aria-hidden="true">&laquo;</span> 
        </a> 
       </li> 
       <li><a href="#">1</a></li> 
       <li><a href="#">2</a></li> 
       <li><a href="#">3</a></li> 
       <li><a href="#">4</a></li> 
       <li><a href="#">5</a></li> 
       <li> 
        <a href="#" aria-label="Next"> 
        <span aria-hidden="true">&raquo;</span> 
        </a> 
       </li> 
       </ul> 
      </nav>      
     </div>  

Answer 1

sizin için yapar bir çerçeve kullanamazsınız bir neden var mı var? jQuery Datatables tüm bunları sizin için yapar.