Question

您好我正在尝试在我的桌子上使用数据表插件，该插件使用mysql查询结果数据进行填充。但是我收到了以下错误。

Uncaught TypeError: Cannot read property 'asSorting' of undefined

请检查下面的代码。

<link rel="stylesheet" type="text/css" href="css/demo_page.css">
<link rel="stylesheet" type="text/css" href="css/demo_table.css">



<table class="table table-striped well dataTable" id="courseslist">
                <tbody><tr>
                    <th>Course ID</th>
                    <th>Course Title</th>
                    <th>Course Desc</th>
                    <th>Course Year</th>
                    <th>Course Start Date</th>
                    <th>Course End Date</th>
                    <th></th>
                    <th></th>
                </tr>
                                    <tr>
                    <td>63495</td>
                    <td>Course C</td>
                    <td>Course C</td>
                    <td>2013</td>
                    <td>14-Oct-2013</td>
                    <td>18-Oct-2013</td>
                    <td><a data-toggle="modal" data-courseid="63495" data-coursetitle="Course C" data-coursedesc="Course C" data-year="2013" data-startdate="2013-10-14" data-enddate="2013-10-18" href="#editcoursemodal" id="editcoursebutton" class="btn btn-warning"><i class="icon-white icon-pencil"></i> Edit</a></td>
                    <td><a data-toggle="modal" data-courseid="63495" href="#deletecoursemodal" id="deletecoursebutton" class="btn btn-danger"><i class="icon-white icon-remove"></i> Delete</a></td>
                </tr>
                                    <tr>
                    <td>66247</td>
                    <td>Course A</td>
                    <td>Course A</td>
                    <td>2013</td>
                    <td>30-Sep-2013</td>
                    <td>04-Oct-2013</td>
                    <td><a data-toggle="modal" data-courseid="66247" data-coursetitle="Course A" data-coursedesc="Course A" data-year="2013" data-startdate="2013-09-30" data-enddate="2013-10-04" href="#editcoursemodal" id="editcoursebutton" class="btn btn-warning"><i class="icon-white icon-pencil"></i> Edit</a></td>
                    <td><a data-toggle="modal" data-courseid="66247" href="#deletecoursemodal" id="deletecoursebutton" class="btn btn-danger"><i class="icon-white icon-remove"></i> Delete</a></td>
                </tr>
                                    <tr>
                    <td>86714</td>
                    <td>Course E</td>
                    <td>Course E</td>
                    <td>2013</td>
                    <td>28-Oct-2013</td>
                    <td>01-Nov-2013</td>
                    <td><a data-toggle="modal" data-courseid="86714" data-coursetitle="Course E" data-coursedesc="Course E" data-year="2013" data-startdate="2013-10-28" data-enddate="2013-11-01" href="#editcoursemodal" id="editcoursebutton" class="btn btn-warning"><i class="icon-white icon-pencil"></i> Edit</a></td>
                    <td><a data-toggle="modal" data-courseid="86714" href="#deletecoursemodal" id="deletecoursebutton" class="btn btn-danger"><i class="icon-white icon-remove"></i> Delete</a></td>
                </tr>
                                    <tr>
                    <td>90013</td>
                    <td>Course B</td>
                    <td>Course B</td>
                    <td>2013</td>
                    <td>07-Oct-2013</td>
                    <td>11-Oct-2013</td>
                    <td><a data-toggle="modal" data-courseid="90013" data-coursetitle="Course B" data-coursedesc="Course B" data-year="2013" data-startdate="2013-10-07" data-enddate="2013-10-11" href="#editcoursemodal" id="editcoursebutton" class="btn btn-warning"><i class="icon-white icon-pencil"></i> Edit</a></td>
                    <td><a data-toggle="modal" data-courseid="90013" href="#deletecoursemodal" id="deletecoursebutton" class="btn btn-danger"><i class="icon-white icon-remove"></i> Delete</a></td>
                </tr>
                                    <tr>
                    <td>96599</td>
                    <td>Course D</td>
                    <td>Course D</td>
                    <td>2013</td>
                    <td>21-Oct-2013</td>
                    <td>25-Oct-2013</td>
                    <td><a data-toggle="modal" data-courseid="96599" data-coursetitle="Course D" data-coursedesc="Course D" data-year="2013" data-startdate="2013-10-21" data-enddate="2013-10-25" href="#editcoursemodal" id="editcoursebutton" class="btn btn-warning"><i class="icon-white icon-pencil"></i> Edit</a></td>
                    <td><a data-toggle="modal" data-courseid="96599" href="#deletecoursemodal" id="deletecoursebutton" class="btn btn-danger"><i class="icon-white icon-remove"></i> Delete</a></td>
                </tr>
                                 </tbody></table>

在此之后我在js部分调用js文件，如下所示。

<script src="js/jquery-1.10.1.js"></script>
<script src="js/jquery.dataTables.js"></script>

$(document).ready(function(event) {

$('#classeslist').dataTable({
    "aoColumns": [
      null
    ]
});
});

我尝试使用"aaSorting": [[ 0, "desc" ]]也无效。

Answer 1

您的表格ID和您对数据表的调用不匹配。

成功

   $('#courseslist').dataTable({

不是#classeslist，它应该可以工作。

无法使用php修复数据表问题

1 个答案: