1

ola pessoal comecei a programar em js e jquery atualmente sou bem iniciante e estou com um pequenos problema estou tentando mostrar o conteudo de uma pagina de fora em um modal porem ele mostra apenas link da busca e não o conteudo

<div class="modal fade" id="myModal">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
            </button>
             <h4 class="modal-title">Paginas</h4>

        </div>
        <div class="modal-body" id="conteudoModal"></div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
        </div>
    </div>
</div>

$("a").click(function (e) {
    var id = $(this).attr('id');
    $('#myModal').modal('show');
    $("#conteudoModal").html(this.href);
});

eu tenho uma outra busca nessa pagina que funciona, quando tento usar o mesmo código ela da vários erros então tentei fazer diferente essa é a busca

$('#chama').submit(function(e){
  e.preventDefault();
  $.ajax({
    url:'teste_b.php',
    method: 'POST',
    data: { nome_cliente: $('#nome_cliente').val()}, // sua data chegará como $_POST['busca_data'] no PHP.
    success: function(data){                      
        $('#resultado_busca').html(data); // data é o valor printado do lado php
        $('#exampleModalLong').modal('show') ; // abre o modal via jquery
     }
    });                     
  return false; // nao ira para lugar algum 
});

ainda sou iniciante e não sei exatamente por que não esta funcionando

2
  • 1
    Recomendo você pesquisar o que a função html do jQuery faz. Você colocou html(this.href), que basicamente é "me mostre essa URL como HTML".
    – Woss
    3/07/2019 às 14:31
  • poderia me dar uma explicada por favor e com eu conserto eu dei uma lida porem não entendi muito bem 3/07/2019 às 14:40

1 Resposta 1

0

O método .html(htmlString) do Jquery espera receber uma string html que ira renderizar.

No seu primeiro exemplo, você esta passando para ele this.href, ele vai pegar o conteúdo do href, no caso o link, e renderizar esse texto no html.

No seu segundo exemplo, o da busca, que já esta funcionando, você esta efetuando um post com o Ajax e o conteúdo retornando do POST dentro de data, que provavelmente é uma string html, é o que você passa para o método renderizar.

Para ter o mesmo comportamento, ao clicar em um <a> carregar o conteúdo desse da pagina para um modal, você vai precisar utilizar o método .load do Jquery.

Exemplo:

$("a").click(function (e) {
    var id = $(this).attr('id');    
    $("#conteudoModal").load(this.href,
        function(response, status, xhr) {
            if (status === "error") {
                alert('erro');
                console.log(response);
            } else {
                $('#myModal').modal('show'); 
            }           
        });
    return false;
});
4
  • funcionou na teoria o codigo rodou mas eu n sei oque aconteceu agora que o modal não quer aparecer com as informações da o sinal que abre inspecionando o codigo mas ele não mostra na tela 3/07/2019 às 16:01
  • @DanielRicardo editei o código para mostrar no console se der erro no load, teste ai e veja se esta dando algum erro no console 3/07/2019 às 16:15
  • eu resolvio erro tinha um jquery na outra pagina que estava inibindo o modal nessa então arrumei e voltou ao normal obrigado por ter me explicado e ajudado 3/07/2019 às 16:43
  • Por nada @DanielRicardo se a resposta te ajudou considere votar a favor e marcar como aceita, obrigado! 3/07/2019 às 20:36

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 .