Get only one PHP variable from another page with Jquery

4

To get the contents of a page I use the date, but I would like to know how to get only one variable on another page. I use this code:

jQuery(document).ready(function(){
        jQuery('.teste').submit( function(){
            var teste = $(this);
            var dados = teste.serialize();
            jQuery.ajax({
                url: "teste.php",
                type: "POST",
                data: dados,

                success: function(data)
                {

                    teste.html(data);


                }

            });

            return false;
        });
    });

But it takes all the content of the page. How would I get only one PHP variable, for example: "$ test". I've put an example below to better illustrate, I know it's not that way.

jQuery(document).ready(function(){
            jQuery('.teste').submit( function(){
                var teste = $(this);
                var dados = teste.serialize();
                jQuery.ajax({
                    url: "teste.php",
                    type: "POST",
                    data: dados,

                    success: function(data)
                    {

                        teste.html(data.$teste);


                    }

                });

                return false;
            });
        });

Test.php page

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <?php
        $teste ="teste";
        $teste2 ="teste2";
        echo $teste;
        echo $teste2;
         ?>
</body>
</html>
    
asked by anonymous 31.10.2017 / 14:53

2 answers

3

I do not know if it's the best, but one way to do this is by sending a variable to the page teste.php and isolating only what you want as a response, in this case the variable $teste . In return, I use $.trim(data) to eliminate unnecessary blanks:

Ajax:

jQuery(document).ready(function(){
            jQuery('.teste').submit( function(){
                var teste = $(this);
                var dados = teste.serialize();
                jQuery.ajax({
                    url: "teste.php?variavel=ok",
                    type: "POST",
                    data: dados,

                    success: function(data)
                    {
                        teste.html($.trim(data));
                    }

                });

                return false;
            });
        });

On page teste.php , I get the variable with $_GET (the other form information is with $_POST ). Everything I do not want to return in Ajax, I put it inside if :

<?php
if ($variavel != "ok"){
?>
<?php } ?>

teste.php :

<?php
$variavel = $_GET['variavel'];

if ($variavel != "ok"){
?>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
<?php } ?>
        <?php
        $teste ="teste";
        $teste2 ="teste2";
        echo $teste;
         ?>
<?php if ($variavel != "ok"){ ?>
</body>
</html>
<?php } ?>
    
31.10.2017 / 19:53
2

Making the PHP response with JSON will be the easiest way to handle JavaScript. First, since the PHP file will be requested through AJAX, it is not necessary to have this entire HTML structure. It only makes sense if it is to display this in some way in the browser, but it does not seem to be the case. So you can do it in PHP:

test.php

<?php

$teste = "valor_teste";
$teste2 = "valor_teste2";

// Indica ao navegador que a resposta será um JSON:
header('Content-Type: application/json');

echo json_encode(compact("teste", "teste2"));

The function compact will generate an array in the form:

["teste" => "valor_teste", "teste2" => "valor_teste2"]

And the json_encode function will convert this to a string in JSON format. So your JavaScript might look like this:

jQuery(document).ready(function(){
    jQuery('.teste').submit( function(){

        var teste = $(this);
        var dados = teste.serialize();

        jQuery.ajax({
            url: "teste.php",
            type: "POST",
            data: dados,
            dataType: "json",
            success: function(data) {
                teste.html(data.teste2);
            }
        });

        return false;
    });
});

Using the dataType property indicates that the PHP return will be a JSON, so the value of data in success will be a JS object created from the JSON returned by PHP, being able to access the attribute teste2 , relative to $teste2 of PHP.

    
31.10.2017 / 20:04