I'm creating a dataTable, where the data for the table is entirely from the database. I tried in the following way: HTML:

<div class="col-sm-10">
    <table border="0" cellpadding="0" cellspacing="0" width="100%" id="invoice_table" class="table table-bordered table-colstriped table-hover display">
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Chain Name</th>
                <th>Type</th>                       
                <th>Amount</th>
                <th>Billable Amount</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>

jQuery:

function year_month(year_month) {
    jQuery("#invoice_table").dataTable({
        "sAjaxSource": "invoice-request-db.php?mode=invoice_dataTable&year_month=" + jQuery("#year_month").val(),
        "bDestroy": true,
        "bPaginate": false,
        "bInfo": false,
        "bFilter": false,
        "bSort": false
    });
}

I'll have to pass a data, which is the year-month along with the URL, so that the datatable gets changed according to the year-month I select. But, when I try using it, I get:

TypeError: f is undefined

which is showed in jquery.dataTables.min.js. What's wrong with this? What should I correct?

I'm creating a dataTable, where the data for the table is entirely from the database. I tried in the following way: HTML:

<div class="col-sm-10">
    <table border="0" cellpadding="0" cellspacing="0" width="100%" id="invoice_table" class="table table-bordered table-colstriped table-hover display">
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Chain Name</th>
                <th>Type</th>                       
                <th>Amount</th>
                <th>Billable Amount</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>

jQuery:

function year_month(year_month) {
    jQuery("#invoice_table").dataTable({
        "sAjaxSource": "invoice-request-db.php?mode=invoice_dataTable&year_month=" + jQuery("#year_month").val(),
        "bDestroy": true,
        "bPaginate": false,
        "bInfo": false,
        "bFilter": false,
        "bSort": false
    });
}

I'll have to pass a data, which is the year-month along with the URL, so that the datatable gets changed according to the year-month I select. But, when I try using it, I get:

TypeError: f is undefined

which is showed in jquery.dataTables.min.js. What's wrong with this? What should I correct?

• javascript
• jquery
• datatables

• 1 Does the d in dataTable need to be capitalized? – damos Commented May 20, 2016 at 5:06
• @duddosai Which type of value in year_month? – Ankur Bhadania Commented May 20, 2016 at 5:38
• @AnkurBhadania The value will be like 2016-05. – SSS Commented May 20, 2016 at 5:42
• Could you show us the server response? – Sebastianb Commented May 20, 2016 at 12:49

5 Answers 5

Error in your jQuery code Replace with this. dataTable({ is not closed

 jQuery("#invoice_table").DataTable({
    "sAjaxSource": "invoice-request-db.php?mode=invoice_dataTable",
    "bDestroy": true,
    "bPaginate": false,
    "bInfo": false,
    "bFilter": false,
    "bSort": false
}); 

Make sure you are including jquery.dataTables.min.js I had the same issue and after hours debugging I realised that I was including dataTables.bootstrap.min.js instead

There is syntax error here.

jQuery("#invoice_table").dataTable({
    "sAjaxSource": "invoice-request-db.php?mode=invoice_dataTable",
    "bDestroy": true,
    "bPaginate": false,
    "bInfo": false,
    "bFilter": false,
    "bSort": false
    //}   <--------------------- You need to remove this. It's an extra bracket
});

This Javascript error generally occur if dataTable's Parameter not initialized.

Solution :

Open datatables.bootstrap.min.js in notePad and write these two line below after this line

var f = b.fn.dataTable;

// Code to Insert start
if(typeof f === "undefined")
return null;
// Code to insert End

Above

This can also happen if the table columns do not match your data elements (I removed an element, but forgot to remove the column, which was the cause of this error).