Как отобразить данные JSON, которые хранятся в текстовом файле для Datatable?

Question

У меня есть файл JSON, сохраненный в файле .txt, и я хотел бы отобразить его в моей таблице данных. Следуя этому руководству , я установил путь "ajax" на моем JS.

$(document).ready(function() {
    $('#example').DataTable( {
        "ajax": "data/objects.txt"
    } );
} );

Однако, если я установлю «столбцы» в JS, модал для отображения таблицы данных не появится, и все события jQuery завершатся неудачно.

"columns": [
            { "data": "name" },
            { "data": "position" },
            { "data": "office" },
            { "data": "extn" },
            { "data": "start_date" },
            { "data": "salary" }
        ]

есть что-то, что я пропустил?

Answer 1

убедитесь, что у вас правильная структура json

следовать этому файлу JSON: https://datatables.net/examples/ajax/data/objects.txt

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

потому что не могу получить доступ к txt-файлу ， Я приведу пример, показывающий, как правильно, надеюсь, полезно для вас

$(document).ready(function() {
    //https://datatables.net/examples/ajax/data/objects.txt
    var data =[{
            "id": "1",
            "name": "Tiger Nixon",
            "position": "System Architect",
            "salary": "$320,800",
            "start_date": "2011/04/25",
            "office": "Edinburgh",
            "extn": "5421"
        },
        {
            "id": "2",
            "name": "Garrett Winters",
            "position": "Accountant",
            "salary": "$170,750",
            "start_date": "2011/07/25",
            "office": "Tokyo",
            "extn": "8422"
        }];
    $('#example').DataTable({
        //"ajax": "https://datatables.net/examples/ajax/data/objects.txt",
        "data": data,
        "columns": [{
            "data": "name"
        },
        {
            "data": "position"
        },
        {
            "data": "office"
        },
        {
            "data": "extn"
        },
        {
            "data": "start_date"
        },
        {
            "data": "salary"
        }]
    });
});

<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<table id="example" class="display" style="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>

Answer 2

Я бы предложил изменить

"ajax": "data/objects.txt"

на

"ajax": "/data/objects.txt"

Обратите внимание на ведущий /.Ваш URL является относительным URL, поэтому система будет использовать полный URL, а затем добавит data/objects.txt.Например,

https://www.yourdomain.com/some/path/data/objects.txt

Использование начального / делает его URL-адресом, относящимся к корню, поэтому он всегда будет иметь путь к:

https://www.yourdomain.com/data/objects.txt