Footableエラー：エラー：列は、私は私の.jspファイルで、このテーブルを持っているテーブル

Question

を示していない、供給されていない：私はこのコードを持って、私がしたAJAX要求からのデータでいっぱいにしたい

<table class="footable table table-striped table-hover" id="clientTable" data-page-size="10" data-filter=#filter> 
    <tbody id="idbody"> 
     <tfoot> 
      <tr> 
       <td colspan='6'> 
        <ul class='pagination pull-right'></ul> 
       </td> 
      </tr> 
     </tfoot> 
    </tbody> 
</table> 

動的にテーブルを埋める：

$.ajax({ 
    type: 'POST', 
    url: 'GetClientSearchResultServlet', 
    success: function (data) { 
    var jsonString = JSON.parse(data); 

    $.each(jsonString, function(k, v) { 
     var $option= "<tr id='tr"+v.id+"'></tr>"; 
     $('#idbody').append($option); 
     $option= "<td class='client-avatar'><i class='fa fa-user'>Ola</i></td>"; 
     $('#tr'+v.id).append($option); 
     $option="<td><a data-toggle='tab' href='#contact-"+v.id+"' onclick=userDetail("+v.id+") class='client-link' id="+v.id+">"+v.name+"</a></td>"; 
     $('#tr'+v.id).append($option); 
     $option="<td>"+v.local+"</td>"; 
     $('#tr'+v.id).append($option); 
     $option="<td class='contact-type'><i class='fa fa-envelope'> </i></td>"; 
     $('#tr'+v.id).append($option); 
     $option="<td>"+v.email+"</td>"; 
     $('#tr'+v.id).append($option); 
     $option="<td class='client-status'><span class='label pull-right'>"+v.entityType+"</span></td>"; 
     $('#tr'+v.id).append($option); 
    }); 
    } 
}); 

を私はそれを実行したとき、それはエラーを与える：「FooTable：未処理の初期化中にエラーがスローされたエラー：列が供給されていません」。しかし、もし私がページ上の要素を調べると、テーブルはコードに現れ、データベースのデータは表示されますが、ページには表示されません。どんな助け？

Answer 1

テーブルヘッダー<th>が定義されていないためです。

FooTables'ドキュメント毎の

（https://fooplugins.github.io/FooTable/docs/getting-started.html）は、あなたのテーブルには、次のようにフォーマットする必要があります。

<table> 
    <thead> 
     ... 
     <tr> 
      <th data-breakpoints="xs">ID</th> 
      <th>First Name</th> 
      <th>Last Name</th> 
      <th data-breakpoints="xs">Job Title</th> 
      <th data-breakpoints="xs sm">Started</th> 
      <th data-breakpoints="xs sm md">DOB</th> 
     </tr> 
    </thead> 
    ... 
</table>