0

I have a page that return a lot of rows. So, I'm using the load more ajax button. This ajax return a column with an edit button and this edit button should open a modal that runs a new ajax. The modal works fine inside my regular pages, but in this one (that the table is loaded from an ajax) it is not working. When I click in the 'Edit' button, the modal opens ok but it does not load any data (not even a 'loading...' text that should be loaded regardless of the response.

This is my script to populate the table:

  $(document).ready(function(){
      loadMoreData();
      function loadMoreData(page){
        $.ajax({
          url : "/ajax/getcontent.php",
          type: "POST",
          cache:false,
          data:{page_no:page, id_campanha:<?=$_GET['id']?>},
          success:function(data){
            $("#carregando").remove();
            if (data) {
              $("#pagination").remove();
              $("#loadData").append(data);
            }else{
              $(".loadbtn").prop("disabled", true);
              $(".loadbtn").html('That is all');
            }
          }
        });
      }
      
      $(document).on('click', '.loadbtn', function(){
        $(".loadbtn").html('Carregando...');
        var pId = $(this).data("id");
        loadMoreData(pId);
      });
  }); 

This is what is returned from the call above:

<tr>
    <td>'.$row["number"].'</td>
    <td>'.$row["link"].'</td>
    <td>'.$row["click"].'</td>
    <td>'.$row["date"].'</td>
    <td>
    <a href="" data-id="1" class="userinfo btn-sm btn-neutral" data-toggle="modal" data-target="#modal-default">
    Editar
</a>
<a href="" data-id="1" class="userinfo btn-sm btn-neutral" data-toggle="modal" data-target="#modal-default">
            Edit
        </a>
    </td>
</tr>';

And this is the script that runs when I click on "Edit" from the response above:

$(document).ready(function(){
        $('.userinfo').click(function(){
            var userid = $(this).data('id');
            // HERE IS NOT ADDING THE 'LOADING...' TO THE MODAL
            $('.modal-body').text('loading..')
            // AJAX request
            $.ajax({
                url: '/ajax/edit.php',
                type: 'post',
                data: {id_grupo: userid, campanha:<?=$_GET['id']?>},
                success: function(response){ 
                    // Add response in Modal body
                    $('.modal-body').html(response); 
                    // Display Modal
                    $('#modal-default').modal('show'); 
                }
            });
        });
    });

Does anyone knows how can I solve it?

Phil
  • 128,310
  • 20
  • 201
  • 202
Guilherme
  • 11
  • 4

0 Answers0