2

Seguinte, estou tentando substituir o alert pelo modal dessa lib que usa o jquery. No caso estou usando o primeiro exemplo:

<div id="ex1" class="modal">
  <p>Usuário ou senha incorretos.</p>
  <a href="#" rel="modal:close">Fechar</a>
</div>

<p><a href="#ex1" rel="modal:open">Open Modal</a></p>

Porém, no meu caso, esse href deve ser executado no controller do php. Aí que entra o meu problema. Como eu poderia acionar essa modal sem um evento (tipo click, por exemplo)? No caso ao que estou me referindo é echo '<script> código </script>';. Obrigado.

3
  • Por que não pode usar um evento click?
    – Sam
    Commented 23/07/2018 às 4:54
  • Vc quer que seja executado, abrir o modal, logo dps da execução do php?
    – Wees Smith
    Commented 23/07/2018 às 5:02
  • Por que ele deve ser acionado de acordo com um resultado de uma query
    – Leandro
    Commented 23/07/2018 às 5:51

1 Resposta 1

3

Segundo a documentação neste link, você pode abrir a modal manualmente apenas chamando o método .modal() do plugin sobre o elemento. Sendo assim não é necessário disparar um evento para isso. O echo seria:

<?php
echo "<script> $('#ex1').modal(); </script>";
?>

O seletor '#ex1' refere-se ao id da modal.

Exemplo sem uso do PHP, apenas para ilustrar o funcionamento:

$('#ex1').modal();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
<div id="ex1" class="modal">
  <p>Usuário ou senha incorretos.</p>
  <a href="#" rel="modal:close">Fechar</a>
</div>

<p><a href="#ex1" rel="modal:open">Open Modal</a></p>

Lembrando que, dependendo de onde o echo for executado, a lib do jQuery e os elementos já devem ter sido carregados. Neste caso, para se prevenir, seria interessante executar o método após o DOM ter sido carregado:

<?php
echo "<script>
document.addEventListener('DOMContentLoaded', function(){ $('#ex1').modal(); });
</script>";
?>

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 .