Table Data not loading data it is only showing "Loading..."

Table Data not loading data it is only showing "Loading..."

kamarkamar Posts: 7Questions: 1Answers: 0

My data table is not loading i am only getting "Loading..." on my browser. Also when inspect i get the error below.

Uncaught TypeError: Cannot read property 'length' of undefined
at datatables.min.js:48
at i (datatables.min.js:35)
at Object.success (datatables.min.js:35)
at i (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at A (jquery.min.js:4)
at XMLHttpRequest.<anonymous> (jquery.min.js:4)

Here's my JSON Data
Array
(
[0] => 490
[atm_id] => 490
[1] => 123220
[terminal_id] => 123220
[2] => CDMN_67_1
[terminal_name] => CDMN_67_1
[3] => 201
[branch_code] => 2012
[4] => Onsite
[onsite_offsite] => Onsite
[5] => NCRC
[vendor_FK] => NCRC
[6] => 10.0.8.1
[local_ip] => 10.0.8.2
[7] => JUSTINA
[custodian_name] => JUSTINA
[8] => 10.0.85.1
[default_gateway] => 10.0.8.1
[9] => LAGOS ISLAND 1
[region] => LAGOS ISLAND 1
)

Here is my html:

manageAtmFleetTable = $("#manageAtmFleetTable").DataTable({
'ajax' : 'php_action/fetchTerminal.php',
'order' : [],

});

Answers

  • tangerinetangerine Posts: 3,365Questions: 39Answers: 395

    https://jsonlint.com/ says your JSON is invalid....

    manageAtmFleetTable = $("#manageAtmFleetTable").DataTable({
    'ajax' : 'php_action/fetchTerminal.php',
    'order' : [],
    });
    

    ....and that's not HTML.

  • kamarkamar Posts: 7Questions: 1Answers: 0
    edited September 2017

    Thanks for your response tangerine, however the JSON i posted is the data i want passed from my DB to the table on my website.

    i know the below is javascript, however, that is how i am passing the data to my website table

    manageAtmFleetTable = $("#manageAtmFleetTable").DataTable({
    'ajax' : 'php_action/fetchTerminal.php',
    'order' : [],
    });
    

    here is fetchTerminal.php

    <?php
    
    require_once 'core.php';
    
    $sql = "SELECT atm_id, terminal_id, terminal_name, branch_code, 
    onsite_offsite, vendor_FK, local_ip, custodian_name, default_gateway, 
    region FROM atm_database ";
    
    $result = $connect->query($sql);
    
    $output = array('data' => array());
    
    if($result->num_rows > 0) {
        while($row = $result->fetch_array()) {
             // echo "<pre>";
             // print_r($row);
             // echo "</pre>";
            $atmId = $row[0];
            
    
    
    
        $output['data'][] = array( 
                $atmId,
                $row[1],
                $row[2],
                $row[3],
                $row[4],
                $row[5],
                $row[6],
                $row[7],
                $row[8],
                $row[9]
    
                );
    
    
            
        } // while
        
    } // /if
    
    $connect->close();
    
    echo json_encode($output);
    

    Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

  • kthorngrenkthorngren Posts: 21,449Questions: 26Answers: 4,975

    As tangerine mentioned your JSON data is not a valid JSON string. This page discusses the data structures Datatables supports.
    https://datatables.net/manual/data/

    The structure you posted does not meet the requirements.

    Kevin

  • kamarkamar Posts: 7Questions: 1Answers: 0

    Thank you kthorngren, i have gone through the document how ever i looked through my code and realize i was using ajax form.serialize(), pls could that be the problem

    if(terminalId && terminalName) {
    var form = $(this);

    //button loading
    $("#createTerminalBtn").button('loading');
    
    $.ajax({
        url: form.attr('action'),
        type: form.attr('method'),
        data: form.serialize(),
        dataType: 'json',
        success:function(response){
            //button loading
            $("#createTerminalBtn").button('reset');
    
            if(response.success == true) {
    
  • allanallan Posts: 63,689Questions: 1Answers: 10,500 Site admin

    What is shown above as "JSON" appears to be the result of the print_r on line 16 (commented out at the moment) rather than the result of the echo json_encode(), which I think is causing some of the confusion.

    Could you run the debugger on your table so we can take a look at the raw response from the server please? There isn't anything obviously wrong that I can see in the code above.

    It would also be worth checking the server's error log to see if there is any information shown there.

    Thanks,
    Allan

  • kamarkamar Posts: 7Questions: 1Answers: 0

    Allan, thank you for your reply however i need clarification on where to paste the debugger code, google chrome has no debugger and mozilla debugger is not writeable. Please help

  • tangerinetangerine Posts: 3,365Questions: 39Answers: 395

    You are expected to use DataTables' own debugger. Instructions for use are right there in the link Allan gave you.

  • kamarkamar Posts: 7Questions: 1Answers: 0

    Please what does this line on datatable.min.css 48 mean

    c);for(b=0;b<f.length;b++)M(a,f[b]);a.iInitDisplayStart=

  • allanallan Posts: 63,689Questions: 1Answers: 10,500 Site admin

    Its a for loop that is part of the minimised code. I could explain it character by character, but I doubt that is actually want to want to know.

    As I said before, I'm happy to help, but please use the debugger I linked to and @tangerine explained, or link to a page showing the issue.

    Allan

This discussion has been closed.