Question

我使用下面的代码在运行时使用bootstrap和datatable插件生成一个表。数据表按预期创建，但是我无法将此表放在div中并控制分页。

有人可以帮我纠正代码，以便相对于div元素创建数据表。

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script src="${pageContext.request.contextPath}/resources/js/jquery-
 3.1.1.min.js"></script>
<link href="${pageContext.request.contextPath}/resources/jTable/media   /css/dataTables.bootstrap.css" rel="stylesheet" type="text/css" />

<link href="${pageContext.request.contextPath}/resources/jTable/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

<script src="${pageContext.request.contextPath}/resources/jTable/media/js/jquery.dataTables.min.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/resources/jTable/media/js/dataTables.bootstrap.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/resources/js/javascript.js" type="text/javascript"></script>

 <script type="text/javascript">
  $(document).ready(function() {
  $('#tblorderbody').DataTable();    
  } );   
 </script>

 </head>
<body>  
<div class="bodyContiner">      
    <div class="runStatus">
        <table class="table table-striped table-bordered" style="cellspacing:0;display: block; position: relative;" id="tblorderbody">
          <thead>
            <tr>
                <th style="width:10%;">CASE ID</th>
                <th style="width:25%;">SCENARIO TYPE</th>
                <th style="width:10%;">ORDER START TIME</th>
                <th style="width:10%;">PROCESS MODE</th>
                <th style="width:10%;">AGENT NAME</th>
                <th style="width:30%;">COMMENTS</th>
                <th style="width:5%;">STATUS</th>
            </tr>
            </thead>
            <tbody id ="tblordertbody">             
            </tbody>                                
        </table>
        <script>displayTablebody();</script>
    </div>
</div>

 </body>
 </html>

如何在DIV元素中定位数据表

0 个答案: