javascript - Ajax 不为数据表调用 php 页面

Question

我正在一起测试 php 和数据表。我首先设计了一个简单的表格作为

<table id="activeDriverGrid"  name='activeDriverGrid'  class="table table-striped table-bordered bootstrap-datatable datatable ">
                          <thead>
                              <tr>
                                  <th>Driver Name</th>
                                  <th>CNumber</th>                                
                              </tr>
                          </thead>   

                      </table> 

只是为了确认我有这个脚本

<script src='js/jquery.dataTables.min.js'></script>

最后在下面我称之为。

<script type="text/javascript" language="javascript" >
            $(document).ready(function() {
                alert("calling");
                 $('#activeDriverGrid').dataTable({
            "bDestroy": true
        }).fnDestroy();

                var dataTable = $('#activeDriverGrid').DataTable( {
                    "processing": true,
                    "serverSide": true,
                    "ajax":{
                        url :"getData.php", // json datasource
                        type: "post",  // method  , by default get
                        success: function (data) {
                 alert("sucess");
            },
                        error: function(){  // error handling
                            $(".activeDriverGrid-error").html("");
                            $("#activeDriverGrid-grid").append('<tbody class="employee-grid-error"><tr><th colspan="3">No data found in the server</th></tr></tbody>');
                            $("#activeDriverGrid-grid_processing").css("display","none");

                        },
                        "bDestroy": true
                    }
                } );
            } );
        </script>

这是我的 getData.php 脚本

try {

        $requestData= $_REQUEST;


        $columns = array( 
        // datatable column index  => database column name
            0 =>'driverID', 
            1 => 'driverName',
            2=> 'driverContactNumber'
        );


         $nestedData=array(); 

         $nestedData[] = "Allan";
         $nestedData[] = "2214141";

         $data[] = $nestedData;

        $totalData=1;
    $totalFiltered = $totalData;
        $json_data = array(
            "draw"            => intval( $requestData['draw'] ),   // for every request/draw by clientside , they send a number as a parameter, when they recieve a response/data they first check the draw number, so we are sending same number in draw. 
            "recordsTotal"    => intval( $totalData ),  // total number of records
            "recordsFiltered" => intval( $totalFiltered ), // total number of records after searching, if there is no searching then totalFiltered = totalData
            "data"            => $data   // total data array
            );

    echo json_encode($json_data);  // send data as json format

}
catch(PDOException $pe)
{
        die("Error In Get Active Drivers :" . $pe->getMessage());
}   

我手动调用了这个页面，结果是 {"draw":0,"recordsTotal":1,"recordsFiltered":1,"data":[["Allan","2214141"]]} 因此确认其工作。我已经在 google chrome 中运行了分析工具，我在网络中没有看到正在调用 getData.php，但是弹出调用出现了。

Answer 1

试试这个

  <script type="text/javascript" language="javascript" >
            $(document).ready(function() {
                alert("calling");
                 $('#activeDriverGrid').dataTable({
            "bDestroy": true
        }).fnDestroy();

                var dataTable = $('#activeDriverGrid').DataTable( {
                    "processing": true,
                    "serverSide": true,
                    });
                     $.ajax({
                        url :"getData.php", // json datasource
                        type: "post",  // method  , by default get
                        data:{data:dataTable},
                        success: function (data) {
                 alert("sucess");
            },
                        error: function(){  // error handling
                            $(".activeDriverGrid-error").html("");
                            $("#activeDriverGrid-grid").append('<tbody class="employee-grid-error"><tr><th colspan="3">No data found in the server</th></tr></tbody>');
                            $("#activeDriverGrid-grid_processing").css("display","none");

                        },
                        "bDestroy": true
                    })
                } );

        </script>