I have a very basic HTML table, The data is from the database. I have now set up a selector and as soon I Select any of the options then an AJAX request to get specific data for a specifically selected location. (To make it easier my query just looks for LocationId=1001 as an example). I now want to return the data and update the DataTable, but unfortunately, the data is returned, and it shows in the table but other DataTable features are not working. Like pagination, Search, and the number of records.

PHP page code

$LocId = '1001';
$sql_Select = "SELECT tbl_employee.EmpId,tbl_employee.FirstName,tbl_employee.LastName,tbl_section.SectionNameEn,tbl_section.SectionNameAr FROM `tbl_employee`,`tbl_section` WHERE tbl_employee.SecId=tbl_section.SecId and tbl_employee.Status='Active' and LocId = '$LocId'";
        $result = mysqli_query($conn, $sql_Select);
        while($row = $result->fetch_assoc()) {
            $rows[] = $row;
          }
        $msg = ["data" => $rows];
        echo json_encode($msg);

Function for Ajax call and return records to view in DataTable

function GetEmployee(){
        var LocId = $('#location').val();

        $('#basic-datatablee').DataTable({
            "destroy": true,
            "processing": true,
            "serverSide": true,
            "serverMethod": "post",
            "ajax": {
                "url": "ajaxpages/get_employee.php",
                "data": {LocId:LocId}
            },
            "columns": [
                    {"data": "EmpId"},
                    {"data": "FirstName"},
                    {"data": "LastName"},
                    {"data": "SectionNameEn"},
                    {"data": "SectionNameAr"},
                ],
            language: {
                searchPlaceholder: 'Search...',
                sSearch: '',
            }
        });
    };

CodePudding user response：

Need to remove

"serverSide": true,
"servermethod": "post",

Add this ajax call type

"type": "POST",

This will solve the problem