Jquery Datatable:f未在jquery.dataTables.min.js中定义

问题描述 投票:1回答:2

我正在使用Jquery Datatables。我得到的f没有定义控制台错误。我没有在Datatables中使用ajax请求。

以下是我的表:

<table id="myTable"  class="table table-striped table-bordered dataTable"  >

    <thead>
      <tr>
         <th>Trip ID</th>
         <th>User Name</th>
         <th>From</th> 
         <th>To</th>
     </tr>
    </thead>
    <tbody>
     <tr><td>123231</td></tr>
     <tr><td>John</td></tr>
     <tr><td>dfshggsf</td></tr>
     <tr><td>dsfgfsgfsg</td></tr> 
   </tbody>
    <tfoot>
         <tr>
          <th>Trip ID</th>
          <th>User Name</th>
          <th>From</th> 
          <th>To</th>       
         </tr>
    </tfoot> 
        </table>    
</table>

下面是Jquery代码:

$(document).ready(function(){
      $('#myTable').DataTable({

          'ordering':false,
            dom: 'Bfrtip',

            buttons:[
                 {
                     extend: 'excelHtml5',
                     title: 'Data export'
                 },
                 {
                     extend: 'pdfHtml5',
                     title: 'Data export'
                 },
                  {
                     extend: 'csvHtml5',
                     title: 'Data export'
                 },
                  {
                     extend: 'print',
                     title: 'Data export'
                 } 
           ]
        });
    });

以下是控制台错误:

TypeError:f未定义[了解更多] jquery.dataTables.min.js:27:64 jb http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery.dataTables.min.js:27:64 ga http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery.dataTables.min.js:48:224 e http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery.dataTables.min.js:92:256 m / <http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery.dataTables.min.js:92:342每个http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery-1.12.4.js:370:10每个http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery-1.12.4.js:137:10 m http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery.dataTables.min.js:82:457 h.fn.DataTable http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery.dataTables.min.js:164:289 http://localhost:8080/RajaRathaDashBoardApp/RajarathaTripHistory:38:4 fire http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery-1.12.4.js:3232:11 fireWith http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery-1.12.4.js:3362:7 ready http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery-1.12.4.js:3582:3 completed http://localhost:8080/RajaRathaDashBoardApp/resources/js/jquery-1.12.4.js:3617:3

请帮我解决这个问题...任何帮助将不胜感激。

javascript jquery datatables
2个回答
2
投票

tbody部分中的表结构不正确。

更正的表结构如下所示。

<tbody>
   <tr>
      <td>123231</td>
      <td>John</td>
      <td>dfshggsf</td>
      <td>dsfgfsgfsg</td>
   </tr> 
</tbody>

有关代码和演示,请参阅this example


1
投票

是的 - 这就是DataTables告诉你表结构不匹配的原因。最可能的解决方案是确保您的<th>行与您的<td>行匹配。

我昨晚遇到了这个问题,当时我注意到last_name不是DataTables搜索框的一部分。 DataTables搜索列定义中提供的字段名称,而不是最终呈现的字段名称。所以我将last_name列添加为visible:false认为它不需要标题。看到相同的样式错误消息,不得不返回并添加到标题行=问题解决。

var columns = [

  { data: "first_name",
    render: function(data, type, row) {
      return row.first_name + " " + row.last_name;
    }
  },
  { data: "last_name",
    visible: false
  },
...
]
© www.soinside.com 2019 - 2024. All rights reserved.