Блог

Я пытаюсь заполнить таблицу результатом успешного вызова ajax. Я работаю здесь над несколькими конечными точками.

Серверная часть (PHP):

серверная часть возвращает массив.

 Array ( 
    [0] => Array ( 
       [eid] => 5060529 
       [uid] => 494 
       [created] => 2020-11-10T14:23:33.903 
       [persnr] => 001354 
       [contractnr] => V-00019 
       [agentnr] => OL-010 
       [location] => 1 
       [client] => 1015 
       [validfrom] => 2020-12-01T00:00:00 
       [validto] => 2020-12-31T00:00:00 
       [isborrowed] => 1 
       [calweek] => 
       [year] => 
    )
   [n] => Array(...)
)
 

Внешний вызов:

при печати result на консоль я сам вижу правильные значения.

 $("#contractDetailBtn").on('click', function(){
  let datefrom = $('input#datefrom').val();
  let dateto = $('input#dateto').val();
  let client = $('input#client').val();

  let link = `/backend/lnk?datefrom=${datefrom}amp;dateto=${dateto}amp;client=${client}`;
  console.log(link);

  $.ajax({
    type: 'GET',
    datatype: 'html',
    url: link,

    success: function(result){
      var table = $("#ajaxpopulate tbody");

      console.log(result);
      
    }
  });
});
 

Моя попытка состояла в том, чтобы просмотреть значения результатов и заполнить таблицу с помощью:

 $.each(result, function(i, e){
  table.append("<tr><td>" e.eid "</td><td>" e.uid "</td><td>" e.created "</td></tr>");
});
 

Который должен работать с использованием json. Поскольку я получаю массив обратно, я явно борюсь с получением формата таким образом, чтобы он мне был нужен. При использовании json_encode() в бэкэнде я получаю экранированный файл, который выглядит как json. Мне было интересно, как я могу получить результат таким образом, чтобы я мог продолжать работать.

Любая помощь была бы очень признательна.

Я сделал это таким образом. Надеюсь, это будет полезно.

 $.ajax({
    url: '/your_api',
    type: 'get',
    success: function (response) {         
      var table_data = '';
      $('#your_table_id').empty();

      for(var i = 0; i<response.length;i  ) {
       table_data  = '<tr>';
       table_data  = '<td>'   i   '</td>';
       table_data  = '<td class="text-wrap">'   response[i].firstName   " "   response[i].lastName   '</a></td>'
       table_data  = '</tr>'; 
      }

      $('#your_table_id').append(table_data);
    }
  });
 

И мой html был таким:

 <table class="table table-bordered">
  <thead>
    <tr>
      <th> heading 1 </th>
      <th> heading 2 </th>
    </tr>
  </thead>
  <tbody id="your_table_id"></tbody>
</table>
 

Из бэкенда PHP я предложу использовать json_encode

Вот так:

 `
$result =  array( 
[0] => Array ( 
   [eid] => 5060529 
   [uid] => 494 
   [created] => 2020-11-10T14:23:33.903 
   [persnr] => 001354 
   [contractnr] => V-00019 
   [agentnr] => OL-010 
   [location] => 1 
   [client] => 1015 
   [validfrom] => 2020-12-01T00:00:00 
   [validto] => 2020-12-31T00:00:00 
   [isborrowed] => 1 
   [calweek] => 
   [year] => 
    )
   [n] => Array(...)
    );

   echo  json_encode("data" => $result);

 `
 

Затем вы получаете его из интерфейса JavaScript следующим образом:

    success: function(result){
     var data = JSON.parse(result);
     // OR
     var data = JSON.parse(result.data);
     var table = $("#ajaxpopulate tbody");
      // then
      console.log(data.data);
     }