AJAX - Appear divs

2

How do I get a div in return of AJAX , for example:

I write in the input a user, and sends the data by AJAX like this:

$("#botao").click(function(){
    var xprocesso = $("#segundo").val();

    $.post('aquirecebe.php',{processo:xprocesso},
        function(data)
        {
            $(".aparecerresultado").html(data);
        })

});

On the page that receives the data, it checks whether the user you are looking for exists.

$sql = mysql_query("SELECT * FROM utilizadores WHERE n_processo = '".$processo."'");

        if(!$sql)
        {
            echo '<script> swal("ERRO!", "Contacte o programador.", "error") </script>';
        }else
        {   
            $contar = 0;
            $contar = mysql_num_rows($sql);

            if($contar <= 0){
                echo '<script> swal("Oops","Pedimos desculpa, mas o utilizador não foi encontrado.","error") </script>';

            }else{
                echo '<script> swal("Sucesso!", "Utilizador encontrado. Pode prosseguir para o registo.", "success") </script>';

            }
        }

So far so good. Now I wanted it to appear when a success message (means a user was found), that a div appears. How do I return the code javascript by AJAX ?

    
asked by anonymous 01.05.2016 / 02:32

3 answers

3

Sending script to run on the client side is not very good. The best would be to pass a JSON and have some logic in the browser to do what you need. I leave an example with Sweet Alert and also with what you ask: add HTML with the answer.

For example in PHP you could have:

$sql = mysql_query("SELECT * FROM utilizadores WHERE n_processo = '".$processo."'");

if (!$sql) {
    echo '{"status": "ERR", "swal": ["ERRO!", "Contacte o programador.", "error"]}';
} else {
    $contar = 0;
    $contar = mysql_num_rows($sql);

    if ($contar <= 0) echo '{"status": "OK", "existe": false, "swal": ["Oops","Pedimos desculpa, mas o utilizador não foi encontrado.","error"]}';
    else echo '{"status": "OK", "existe": true, "swal": ["Sucesso!", "Utilizador encontrado. Pode prosseguir para o registo.", "success"]}';
}

And then in JavaScript:

$("#botao").click(function() {
    var xprocesso = $("#segundo").val();
    $.post('aquirecebe.php', {processo: xprocesso}, function(data) {
        var res = JSON.parse(data);

        // mostrar resultado via Sweet Alert
        swal.apply(swal, res.swal);

        // mostrar resultado via DIV
        var $resultado = $(".aparecerresultado");
        $resultado.html(""); // para apagar
        var titulo = $('<h3/>', {text: res.swal[0]}).appendTo($resultado);
        var texto =  $('<hspan/>', {text: res.swal[1]}).appendTo($resultado);
    });
});
    
01.05.2016 / 07:49
2

There are several ways to do this, the most common would be this way:

<div id="resultado" style="display:none;"></div>
<script>
$("#botao").click(function(){
    var xprocesso = $("#segundo").val();

    $.post('aquirecebe.php',{processo:xprocesso},
        function(data)
        {
            $("#resultado").css("display", "");
            $("#resultado").html(data);
        })

});
</script>

That way you can style your div with css the way you want.

    
01.05.2016 / 03:41
1

You're returning a script to appear inside a div, I do not quite understand. Why not return the success / error message as plain HTML? For example:

<p>Mensagem de sucesso</p>

And then in the Ajax success function you do:

$(".aparecerresultado").html(data);

And so the returned HTML will appear in the div. You can use CSS and format better to make the message more attractive to the user.

    
01.05.2016 / 15:51