How to fix data not displaying on DataTable

How to fix data not displaying on DataTable

hasanal01hasanal01 Posts: 3Questions: 1Answers: 0

I've just recently discovered DataTables and would like to implement in my web. Followed the instructions for SSP data but it failed to output my data.

I've tried some of the solutions from several other websites but none works.

index.php

<script>
function() {
$('#staff').DataTable( {
    processing: true,
    serverSide: true,
    ajax: {
        url: 'data.php',
        type: 'POST'
    };
} );
}
</script>

data.php

<?php

$table = 'staff';

$primaryKey = 'staff_id';

 $columns = array(
array( 'db' => 'staff_id', 'dt' => 0 ),
array( 'db' => 'grade',  'dt' => 1 ),
array( 'db' => 'name',   'dt' => 2 ),
array( 'db' => 'position',     'dt' => 3 ),
array( 'db' => 'cost_centre',     'dt' => 4 ),
array( 'db' => 'station',     'dt' => 5 ),
array( 'db' => 'ic_number',     'dt' => 6 ),
array( 'db' => 'status',     'dt' => 7 )
);

// SQL server connection information
$sql_details = array(
'user' => 'root',
'pass' => '',
'db'   => 'feldatransport',
'host' => 'localhost'
);

require( 'ssp.class.php' );

echo json_encode(
SSP::simple( $_GET, $sql_details, $table, $primaryKey, $columns )
);
?>

I would like the data to display in my staff table.

Answers

  • kthorngrenkthorngren Posts: 21,300Questions: 26Answers: 4,945

    Do you get any alert errors or errors in your browser's console?

    Kevin

  • hasanal01hasanal01 Posts: 3Questions: 1Answers: 0

    jQuery is not defined in the datatable.js eventhough i have already picked jQuery together in the download builder

  • hasanal01hasanal01 Posts: 3Questions: 1Answers: 0

    This is my repo for the files above. https://github.com/HDI1234/problems.git

  • kthorngrenkthorngren Posts: 21,300Questions: 26Answers: 4,945

    jQuery is not defined in the datatable.js eventhough i have already picked jQuery together in the download builder

    If this is the case then you are loading jQuery twice which is causing the problem. You are also loading it on line 263.
    <script src="bower_components/jquery/dist/jquery.min.js"></script>

    Remove the one on line 263.

    Kevin

This discussion has been closed.