Link to modal window crashes when browsing paging in a Codeigniter application

Question

I have an application developed in Codeigniter with Bootstrap, with all navigation structure using the Routes and pagination. When I remove the pagination, the delete modal window opens correctly via the "Delete" link. But when I add this feature the link stops working, except for the first page, where we have no parameters in the links to indicate which page will be loaded.

In summary the modal window is not displayed if you navigate beyond the first page. I made several changes and tests and did not identify the fault. Could you help me?

The following are the contents of my preview file:

<div class="table-responsive">
    <table class="table card-table table-vcenter text-nowrap">
      <thead>
        <tr role="row">
            <th class="text-center">Ano</th>
            <th>Nome</th>
            <th class="text-center">Ativa</th>
            <th class="text-center"></th>
        </tr>
      </thead>
      <tbody>
        <?php foreach ($dataset as $row){ ?>
          
        <tr role="row" class="odd">
          <td class="text-center"><?php echo $row->num_year; ?></td>
          <td><?php echo $row->name; ?></td>
          <td class="text-center">
            <?php echo fsHmtlColumnActive($row->active); ?>  
          </td>
          <td class="text-center">
            <a class="text-blue mr-4" href="javascript:void(0)">
                <i class="fe fe-edit-3 mr-1"></i>Editar
            </a>
            <a href="javascript:void(0)"
               class="confirma_exclusao text-red"
               data-target="#modal_confirmation"
               data-key="<?php echo $link_delete.'/'.md5($row->season); ?>"
               data-name="<?php echo $row->name; ?>" />
               <i class="fe fe-trash mr-1 text-red"></i>Excluir
            </a>
          </td>
        </tr>

        <?php } ?>
      </tbody>
    </table>
</div>

<div class="card-footer">
    <?php echo (!empty($dsPagination) ? $dsPagination : ''); ?>
</div>

And then the add-on with the delete modal and script used:

<!-- Form modal para Delete de registro -->
<div class="modal modal-danger fade" id="modal_confirmation">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h1 class="modal-title">
          <i class="fe fe-trash mr-1 text-red"></i><br>
        </h1>
      </div>
      <div class="modal-body">
        <div class="pb-3">
          <strong>Deseja excluir o registro selecionado?</strong>
        </div>
        <h4 class="pb-3">
          <strong><span id="nome_exclusao"></span></strong>
        </h4>
        <div class="text-muted text-red">Esta ação não poderá ser desfeita.</div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Retornar</button>
        <button type="button" class="btn btn-danger" id="btn_excluir">Excluir</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script type="text/javascript">
  var lsLinkDel = "<?php echo base_url(); ?>";
  $(function(){
    $('.confirma_exclusao').on('click', function(e){
      e.preventDefault();

      var lsName = $(this).data('name');
      var liKey = $(this).data('key');

      $('#modal_confirmation').data('name', lsName);
      $('#modal_confirmation').data('key', liKey);
      $('#modal_confirmation').modal('show');
    });

    $('#modal_confirmation').on('show.bs.modal', function() {
      var name = $(this).data('name');
      $('#nome_exclusao').text(name);
    });

    $('#btn_excluir').click(function(){
      var lsLinkKey = $('#modal_confirmation').data('key');
      document.location.href = lsLinkDel + lsLinkKey;
    });
  });
</script>

And finally the Routes I’m using for this page:

$route['seasons']               = 'prepare/Seasons';
$route['seasons/(:num)']        = 'prepare/Seasons';
$route['seasons_delete/(:any)'] = "prepare/Seasons/db_delete/$1";

Answer 1

The problem as far as I know is not in the pagination, but how is calling your modal. He must have a [id] and a [data-target="#modal_confirmation"] dynamic.

For example, I put as the data-target=<?php echo $idproduto; ?>, where $idproduct may be any data that is not repeated.

and then you need to call it there in your . JS in id.

It may seem confusing explaining, but it will make more sense when you watch this video: https://www.youtube.com/watch?v=yWIJVaNyTKQ