datatables插件AJAX请求数据报错Uncaught TypeError: Cannot read property ‘length‘ of undefined
之前常用的表格插件是bootstraptable·,現在換了地方工作,這邊用的是datatables。上午再看官網API,感覺寫的不是很清晰很到位。
看到一篇博客寫的很詳細,收藏了。最全的jquery datatables api 使用詳解-Amoni
我根據網上的例子寫了一個ajax請求數據的demo,結果報錯Uncaught TypeError: Cannot read property 'length' of undefined,錯誤位置實在datatables插件的js里面。代碼如下:
?<!DOCTYPE html>
<html>
????<head>
????????<meta charset="UTF-8">
????????<title>DataTables</title>
????????<!--第一步:引入Javascript / CSS (CDN)-->
????????<!-- DataTables CSS -->
????????<link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.15/css/jquery.dataTables.css">
?????????
????????<!-- jQuery -->
????????<script type="text/javascript" charset="utf8" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
?????????
????????<!-- DataTables -->
????????<script type="text/javascript" charset="utf8" src="http://cdn.datatables.net/1.10.15/js/jquery.dataTables.js"></script>
????</head>
????<body>
????????<!--第二步:添加如下 HTML 代碼-->
????????<table id="table_id_example" class="table table-striped table-bordered table-hover" cellspacing="0" width="100%">
????????????<thead>
????????????<tr>
????????????????<th>姓名</th>
????????????????<th>崗位</th>
????????????????<th>工資</th>
????????????????<th>部門</th>
????????????</tr>
????????????</thead>
????????????<tbody>
????????????</tbody>
????????</table>
????????<script>
????????????<!--第三步:初始化Datatables-->
????????????$(document).ready( function () {
????????????????/*var tabledata;
????????????????$.ajax({
????????????????????type:"post",
????????????????????url:"https://www.easy-mock.com/mock/5b5064a129bddf4b872cce05/zyn/getTable",
????????????????????async:false,
????????????????????success: function(data){
????????????????????????tabledata = data
????????????????????}
????????????????});*/
???????????????var table = ?$('#table_id_example').DataTable({
???????????????????/* data: tabledata,*/
??????????????????????ajax: {
??????????????????????????url: "https://www.easy-mock.com/mock/5b5064a129bddf4b872cce05/zyn/getTable2"
??????????????????????},
????????????????????columns: [
????????????????????????{ data: 'name' },
????????????????????????{ data: 'position' },
????????????????????????{ data: 'salary' },
????????????????????????{ data: 'office' }
????????????????????]
????????????????});
????????????} );
????????</script>
????</body>
</html>
總結
以上是生活随笔為你收集整理的datatables插件AJAX请求数据报错Uncaught TypeError: Cannot read property ‘length‘ of undefined的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 如何修改Xshell默认存储路径
- 下一篇: SecureCRT设置背景颜色和目录(文