Jquery append max heightを超えています

Question

私はオブジェクトのリストをループし、テーブルにhtmlを追加するjqueryコードを持っています。しかし、私はすでに親/テーブルの最大高さを設定しています。表の行はまだ親を超えています。

レコードは画像内の赤い線で停止し、スクロールバーが表示されます。

誰でも助けることができますか？

のjQuery

$.each(data, function (i, item) { 
    $('#dataTable').append("<tr><td>" + i + '</td><td>' + item.name+ '</td><td>' + item.English + '</td><td>' + item.Quantity + '</td><td>' + item.Brand + '</td></tr>') 
}); 

HTML

<div class="panel panel-default" style="height:700px;"> 
    <div class="panel-heading">Records</div> 
    <div class="panel-body" style="max-height:700px; z-index:5;"> 
     <table id="dataTable" class="table" style="height:700px;overflow:auto;"> 
     <tr> 
      <th>S/N</th> 
      <th>name</th> 
      <th>Description</th> 
      <th>Qty</th> 
      <th>Brand</th> 
     </tr> 
     </table> 
    </div> 
</div> 

Answer 1

テーブルタグheight:700px;overflow:auto;から、次のスタイルの例を削除し、クラスにoverflow:auto;スタイルのケースを適用10。 overflow:auto;スタイルタグはテーブルタグでは機能しません。