Tablo satırlarını dinamik olarak oluşturduktan sonra Bootstrap "tablo-çizgili" uygulama

Question

Twitter Bootstraptable-stripped CSS stilinin satırları dinamik olarak çalışma zamanında eklenmiş bir tabloya uygulandığından emin olmaya çalışıyorum. Bazı nedenlerden dolayı, dibe inmeye çalışıyorum, bu yeni stili işe yaramayacağım, böylece yeni satırları soyulmuş bir görünüme sahip olacak.

yüzden dahil table-stripped ile bu HTML varsa:

for (var i = 0; i < 5; i++) 
{ 
    $('#table2 > tbody:last').before('<tr><td>' + i +'</td><td>b</td><td>c</td>'); 
} 

benim 5 yeni satırlar alırsınız ama onlar olmaz: Sonra

<table class="table table-bordered table-striped table-condensed table-hover" id="table2"> 
    <thead> 
     <tr> 
      <th>Heading A</th> 
      <th>Heading B</th> 
      <th>Heading C</th> 
     </tr> 
    </thead> 
    <tbody></tbody> 
</table> 

bu JavaScript kodu çalıştırmak table-stripped stili uygulandı.

Sınıfı, bunu kullanarak oluşturduktan sonra elle eklesem bile, fark etmez.

$('#table2').addClass('table-hover'); 

Bu koşuyu görebilmeniz için bir jsFiddle sample oluşturdum.

Answer 1

Sen önce tbody yerine eklenecek kullanmalıdır. Şimdi olduğu gibi, satırlar tbody'un dışına eklenir.

sadece bu çizgiyi değiştirme:

$('#table2 > tbody:last').append('<tr><td>' + i +'</td><td>b</td><td>c</td>'); 

sizin jsFiddle çalışması gibi görünüyor.

Answer 2

<tbody>'a .append() olarak değiştirin ve eksik kapanış </tr>'u düzeltin.

$('#table2 > tbody').append('<tr><td>' + i +'</td><td>b</td><td>c</td></tr>'); 

Demo

.before() kullanarak, Bootstrap tarzı tbody çocukları satırları hedeflediği için uygulanacak olup tarzı neden tbody önceki satırları ekleyerek bulundu.