jquery datatable не инициализируется с данным ответом

Question

Я хочу инициализировать таблицу данных с моим сгенерированным ответом

мой ответ выглядит следующим образом

{data: Array(3), status: true}
data :  Array(3)
0  :    {countryId: 1, countryName: "sampleCountry", countryShortCode: "sampleCode", status: "yes"}
1  :    {countryId: 2, countryName: "pakistan", countryShortCode: "pak", status: "yes"}
2  :    {countryId: 3, countryName: "sample2", countryShortCode: "pak", status: "yes"}

пожалуйста, посмотрите мой HTML

<table class="table table-striped" id="countryTable">

                                    <thead>
                                      <tr>
                                        <th>S.NO.</th>
                                        <th>Country Name</th>
                                        <th>Country Short Name</th>


                                      </tr>
                                    </thead>
                                    <tbody>
                                   </tbody>
</table>

пожалуйста, посмотрите намоя инициализация с датой

$.ajax({        
            url : url,

            type:"get",     
            contentType:'application/json; charset=utf-8',  
            dataType: 'json' ,
            async: false,  
            success:function(response) 
            {     
                alert(response.data);  

                  $('#countryTable').DataTable( {
                        "fnRowCallback" : function(nRow, aData, iDisplayIndex){
                            $("td:first", nRow).html(iDisplayIndex +1);
                           return nRow;
                        },
                         destroy: true,
                        mydata: response.data, 
                        columns: [     
                             { mydata:'countryId'},   
                             { mydata:'countryName'},
                             { mydata:'countryShortCode'}     


                        ]  
                    } );         

                console.log(response);
            }
        });

после таблицы данных инициализации отображается как Нет данных, доступных в таблице , но таблица инициализируется с помощью плагина с данными.данные не поступают в таблицу.что пошло не так в моем коде, пожалуйста, помогите мне.

Answer 1

Код выглядит нормально, вам просто нужно изменить mydata на data, вот так:

var response = {
  data: [{
      countryId: 1,
      countryName: "sampleCountry",
      countryShortCode: "sampleCode",
      status: "yes"
    },
    {
      countryId: 2,
      countryName: "pakistan",
      countryShortCode: "pak",
      status: "yes"
    },
    {
      countryId: 3,
      countryName: "sample2",
      countryShortCode: "pak",
      status: "yes"
    }
  ],
  status: true
}

$('#countryTable').DataTable({
  "fnRowCallback": function(nRow, aData, iDisplayIndex) {
    $("td:first", nRow).html(iDisplayIndex + 1);
    return nRow;
  },
  destroy: true,
  data: response.data,
  columns: [{
      data: 'countryId'
    },
    {
      data: 'countryName'
    },
    {
      data: 'countryShortCode'
    }


  ]
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet" />
<table class="table table-striped" id="countryTable">

  <thead>
    <tr>
      <th>S.NO.</th>
      <th>Country Name</th>
      <th>Country Short Name</th>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>