Datatable не загружать данные из JSON

Question

Я пытаюсь загрузить данные Json в таблицу данных, но не загружаюсь

Ниже приведен код таблицы данных

function loadItemDetails(jsonData ) {
    $('#itemsDetails').DataTable( {
        mData: jsonData ,
        columns: [
            { data: "netAmount" }
        ]
    } );

В HTML код таблицы:

           <table class="table" id="itemsDetails">
                        <thead class="table-head">
                            <tr>
                                <th scope="col">Sr. No.</th>
                                <th scope="col">Qty</th>
                                <th scope="col">Net Amount</th>
                                <th scope="col">Promo</th>
                                <th scope="col">CB</th>
                            </tr>
                        </thead>
                    </table>

Данные Json:

var jsonData = [{"netAmount":"20"},{"netAmount":"20"},{"netAmount":"20"}];

Answer 1

Проблема в том, что вы использовали mData вместо data.

function loadItemDetails(jsonData) {
    $('#itemsDetails').DataTable( {
        data: jsonData,
        columns: [
            { data: null },
            { data: null },
            { data: "netAmount" }
        ]
    })
}

loadItemDetails([{"netAmount":"20"},{"netAmount":"20"},{"netAmount":"20"}]);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
<table class="table" id="itemsDetails">
  <thead class="table-head">
    <tr>
      <th scope="col">Sr. No.</th>
      <th scope="col">Qty</th>
      <th scope="col">Net Amount</th>
      <th scope="col">Promo</th>
      <th scope="col">CB</th>
    </tr>
  </thead>
</table>

Answer 2

Это работает для меня.

var jsonData =  [{"netAmount":"20"},{"netAmount":"20"},{"netAmount":"20"}];
$(document).ready(function() {
    $('#example').DataTable( {
        data : jsonData,
        "columns": [
            { "data": "netAmount" },

        ]
    } );
} );

Вот рабочая демоверсия

Просто держите записку о версии с датой

Answer 3

Вам нужно конвертировать json в объект json, как показано ниже:

jsonData = JSON.stringify(jsonData);

Надеюсь, это поможет вам!