0

Tenho uma aplicação desenvolvida em Codeigniter com Bootstrap, com toda estrutura de navegação usando as routes e paginação. Quando eu retiro a paginação, a janela modal de exclusão é aberta corretamente através do link "Excluir". Mas quando eu adiciono este recurso o link deixa de funcionar, exceto para a primeira página, em que não temos parâmetros nos links para indicar qual a página que será carregada.

Em resumo a janela modal não é exibida se navego além da primeira página. Realizei diversas mudanças e testes e não identifiquei a falha. Poderiam me ajudar?

A seguir temos o conteúdo de meu arquivo de visualização:

<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>

E a seguir o complemento com o modal de delete e script utilizado:

<!-- 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>

E finalmente as routes que estou usando para esta página:

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

1 Resposta 1

0

O problema até onde sei não é na paginação, mas sim como está chamando o seu modal. Ele dever ter um [id] e um [data-target="#modal_confirmation"] dinâmico.

Por exemplo, eu coloco como o data-target=<?php echo $idproduto; ?>, onde $idproduto pode ser qualquer dado que não se repita.

e depois você precisa chamar isso lá no seu .JS em id.

Pode parecer confuso explicando, mas vai fazer mais sentido quando você assistir esse vídeo: https://www.youtube.com/watch?v=yWIJVaNyTKQ

2
  • Olá Marcos, obrigado pela ajuda. Após assistir ao vídeo fiz as mudanças que você comentou e também apliquei o mesmo código do exemplo para comparar os resultados e obtive o mesmo comportamento, ou seja, para a primeira página a janela modal funciona perfeitamente, mas para as demais páginas não abre o modal. Fiz um visual diff para validar possíveis diferenças no código e não há nada além dos IDs de cada loop.
    – Marcelo
    20/07/2020 às 19:29
  • Além disso, pelo exemplo enviado temos a replicação do código modal para cada registro. Eu estava planejando utilizar apenas um código modal para todos os registros usando o data- junto com Javascript para substituir os valores.
    – Marcelo
    20/07/2020 às 19:34

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .