Populating jQuery datatables from mysql using ajax

Question

I am trying to populate datatables on button click which will send a date to process.php which in turn will query the database and output a json array.

Here are my code:

Javascript:

var dailyCollTable = $("#dailyColl").DataTable();

$("#dailyBills").click(function(){
    var date = $("#billDate").val();
    $.ajax({
        type:'post',
        url:'process.php',
        data:{date:date},
        dataType:'json',
        success:function(s){
            console.log(s);
            dailyCollTable.fnClearTable();
            for(var i = 0; i < s.length; i++){
                dailyCollTable.fnAddData([ s[i][0], s[i][1], s[i][2], s[i][3], s[i][4], s[i][5] ]);
            }
        }
    });
});

And this is my process.php

<?php
$connection = mysqli_connect("localhost", "root", "", "database");

$date = $_POST['date'];

$query = mysqli_query($connection,"SELECT CustomerName,BillNumber,BillDate,BillAmount,PaidAmount,PaymentDate FROM billentry WHERE Status=1 AND PaymentDate='$date'");

while($fetch = mysqli_fetch_array($query)){
    $output[] = array ($fetch[0],$fetch[1],$fetch[2],$fetch[3],$fetch[4],$fetch[5]);
}
echo json_encode($output);

?>

I checked browser console. the array is coming fine. The error I am getting is

Uncaught TypeError: dailyCollTable.fnClearTable is not a function

I have included all the necessary libraries.

The exact same code worked on my earlier tables.

Answer 1

There is mistake at the end of query ...PaymentDate='$date'

You should write ...PaymentDate='" . $date . "'