List data with Ajax and PHP

Question

I have the following table

<?php foreach ($this->views->clients as $client): ?>
    <tr class="tr_<?= $client['id'];?>">
        <td><?= $client['id']; ?></td>
        <td><?= $client['name']; ?></td>
        <td><?= $client['email']; ?></td>
        <td><?= $client['nickname']; ?></td>
        <td><?= $client['hour_value']; ?></td>
        <td><?= $client['discount']; ?></td>
        <td><?= $client['date_pagment']; ?></td>
        <td><?= $client['cep']; ?></td>
        <td class="text-center"><a href="" class="glyphicon glyphicon-pencil"></a></td>
        <td class="text-center"><a href="" id="<?= $client['id']; ?>" class="getId glyphicon glyphicon-remove" data-toggle="modal" data-target="#myModal"></a></td>
    </tr>
<?php endforeach; ?>

on this very page has a modal which is a form that inserts the dados that will appear in this table, I would like to know what is the best way to load these dados dynamically with AJAX, would also like the new records to be displayed at the top of the table.

Code AJAX to insert dados:

// Register and list clients script
 $(function() {
     $('#AjaxRequestClient').submit(function(e) {
         e.preventDefault();
         var form = $(this).serialize(); // Pode ser usado serializeArray()
         var request = $.ajax({
             method: "POST",
             url: "/registerClient",
             data: form,
             dataType: "json",
             success: function() {

             }
         });

         request.done(function(e) {
             $('#msg').html(e.msg);
             $('.alert').removeClass('fade').addClass('alert-danger');

             if (e.status) {
                 $('#AjaxRequestClient').each(function() {
                     $('.alert').removeClass('alert-danger').addClass('alert-success');
                     this.reset();
                 });
             }
         });

         return false;
     });
 });

Answer 1

I assume you are using jQuery. To put new content at the top of the table just use the function prepend (insert content at the beginning of an element). Something like this:

request.done(function(e){
        $('#msg').prepend(e.msg);
        //...
});

Depending on which element has the id #msg, there may be an unexpected result (if it is directly in the table tag and thead is included).