Ajax data source (objects) - not working

Ajax data source (objects) - not working

evil_evilevil_evil Posts: 6Questions: 1Answers: 0

Hi,
something is wrong but i can't catch it..
If i copy from the example all the js/ajax/html code, it keep saying "No data available in table"..

HTML:

<!DOCTYPE html>
<html>
<head>
        <meta charset="UTF-8">

        <link rel="stylesheet" type="text/css" href="stupid_css.css" />

        <!-- JQUERY  -->
        <link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.10.4/themes/cupertino/jquery-ui.css" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js" type="text/javascript"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js" type="text/javascript"></script>

        <!-- DATATABLE  -->
        <script src="js/datatable/js/jquery.dataTables.js" type="text/javascript"></script>
        <link rel="stylesheet" type="text/css" href="js/datatable/css/jquery.dataTables_themeroller.css" />
        <link rel="stylesheet" type="text/css" href="js/datatable/css/jquery.dataTables.css" />

<script type="text/javascript">

        var oTable;

        $(document).ready(function() {
                oTable = $('#example11').dataTable( {
                        "ajax": "data/object.txt",
                        "columns": [
                            { "data": "name" },
                            { "data": "position" },
                            { "data": "office" },
                            { "data": "extn" },
                            { "data": "start_date" },
                            { "data": "salary" }
                        ]
                } );
        } );
</script>
....

<table id="example11" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Extn.</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>

        <tfoot>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Extn.</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </tfoot>
    </table>
</body>
</html>

AJAX:

{
  "data": [
    {
      "name": "Tiger Nixon",
      "position": "System Architect",
      "salary": "$320,800",
      "start_date": "2011/04/25",
      "office": "Edinburgh",
      "extn": "5421"
    },
    {
      "name": "Garrett Winters",
      "position": "Accountant",
      "salary": "$170,750",
      "start_date": "2011/07/25",
      "office": "Tokyo",
      "extn": "8422"
    }
]
}

the data file is:
/var/www/html/data/object.txt

the html file is:
/var/www/html/lesson-1.php

the OS is CentoOS 7.

Thanks !

Answers

  • allanallan Posts: 61,833Questions: 1Answers: 10,133 Site admin

    Looks like it should work. Any errors in the console in your browser?

    Allan

  • evil_evilevil_evil Posts: 6Questions: 1Answers: 0

    no error from firebug.

    i'm using datatable v. 1.9.4
    jquery v 1.10.0

    is there any function for check if datatable has read the file?
    somethings like an alert box with the row number of the file readed.

    if i debug the datatable js (not min) which is the function that do the ajax call?

    Thx.

  • allanallan Posts: 61,833Questions: 1Answers: 10,133 Site admin

    i'm using datatable v. 1.9.4

    That's the problem then. Try 1.10.4 - the current release.

    Allan

This discussion has been closed.