JSon is not picking up the data

0

I'm doing some testing with ajax , and I made a very simple script in php shown below:

index.php

    <!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
            <script type="text/javascript">
                $(document).ready(function()
                {
                    $("select[name='nome']").change(function()
                    {
                        alert('Entrou');
                        var preco = $("input[name='preco']");
                        var teste = $("select[name='nome']").val();
                        //alert(teste);
                        $( preco ).val('Carregando...');


                        //$.getJSON(
                        //'function.php',
                        //{ 
                        //  produto_id: $( "select[name='nome']" ).val()
                        //},
                        //function( json )
                        //{
                        //  $( preco ).val( json.preco );
                        //}
                        $.ajax({ 
                            type: "GET",
                            dataType: 'json', 
                            url: "function.php", 
                            data: "produto_id="+ $("select[name='nome']").val(), 
                            success: function(json){ 
                                //informacoesPessoa = pessoa.split("-"); 
                                //$("#nome").val(informacoesPessoa[0]); 
                                //$("#dataNascimento").val(informacoesPessoa[1]);
                                alert(json.produto_preco); 
                                $("input[name='preco']").val(json.produto_preco);
                            } 
                        });
                    //);
                });
            });
            </script>
    </head>
    <body>
        <form action="" method="post">
            <label>Produto: <select name="nome">
            <option value="">--</option>
            <?php
                include 'function.php';
                echo montaSelect();
            ?>
            </select></label>
            <label>Preço: <input name="preco" type="text" disabled="disabled" value="" /></label>
        </form>
        <div id="test"></div>
    </body>
</html>

function.php

<?php
    $con = mysql_connect('localhost', 'root', 'root');
    mysql_select_db('vendas', $con);

    /**
    * função que retorna o select
    */
    function montaSelect()
    {
        $sql = "SELECT 'produto_id', 'produto_nome' FROM 'produto' ";
        $query = mysql_query( $sql );

        if( mysql_num_rows( $query ) > 0 )
        {
            while( $dados = mysql_fetch_assoc( $query ) )
            {
                $opt .= '<option value="'.$dados['produto_id'].'">'.$dados['produto_nome'].'</option>';
            }
        }
        else
            $opt = '<option value="0">Nenhum produto cadastrado</option>';

        return $opt;
    }

    /**
    * função que devolve em formato JSON os dados do cliente
    */
    function retorna( $id )
    {
        $id = (int)$id;

        $sql = "SELECT 'produto_id', 'produto_preco' FROM 'produto' WHERE 'produto_id' = {$id} ";
        $query = mysql_query( $sql );

        $arr = Array();
        $row = mysql_fetch_row($query);
        $preco = $row[1];
        //if( mysql_num_rows( $query ) )
        //{
        //  while( $dados = mysql_fetch_object( $query ) )
        //  {
        //      $arr['produto_preco'] = $dados->produto_preco;
        //  }
        //}
        //else
        //  $arr[] = 'Produto: não encontrado';

        echo json_encode($preco);
        //return json_encode( $arr );
    }

    /* só se for enviado o parâmetro, que devolve o combo */
    if( isset($_GET['produto_id']) )
    {
        echo retorna( $_GET['produto_id'] );
    }
?>

When I access function.php as follows:

http://localhost/testes/function.php?produto_id=1

It returns me on the screen the correct data: "2.50"

However, JavaScript is not taking this value and displaying it in input . What am I missing?

    
asked by anonymous 05.04.2014 / 04:38

2 answers

2

In fact, it is not passing a JSON object, it is simply passing a string. You are calling an attribute of the JSON object called product_preco, the attribute does not exist, and neither does the object.

You can get the value simply by passing the json variable. Then you can change the name of the variable to make more sense.

 success: function(preco){ 
    $("input[name='preco']").val(preco);
 }

If you want to pass a JSON object through PHP, at least one array must be created. In your case it would be:

echo json_encode(array('produto_preco' => $preco));

In your case it is not necessary, but only for you to see what it would look like.

    
05.04.2014 / 05:19
1

There are 2 errors preventing your script from working correctly

Here in this line:

data: "produto_id="+ $("select[name='nome']").val(),

To get the value of the selected option use the :selected selector in the option elements that are within select :

data: "produto_id="+ $("select[name='nome'] option:selected").val(),

In the request callback, when you try to access the result:

success: function(json){ 
    //informacoesPessoa = pessoa.split("-"); 
    //$("#nome").val(informacoesPessoa[0]); 
    //$("#dataNascimento").val(informacoesPessoa[1]);
    alert(json.produto_preco); 
    $("input[name='preco']").val(json.produto_preco);
}

Since PHP is returning 2.50 this is already the value of the json variable, there is no way to access json.produto_preco , you can simply do:

alert(json);

One more thing, it seems that 2.50 is coming as a string, if you need to do some arithmetic operation with it in Javascript you should convert it to float in PHP.

$preco = (float)$row[1];

If you need to return multiple values for Javascript at once, then you should create an array in PHP to represent those values in JSON.

Example

PHP

$data = array(
    'produto_preco' => $preco,
    'produto_data' => '05-04-09',
    'produto_nome' => 'Carne'
);

echo json_encode($data);

Now you can access the data as a Javascript Object.

document.write("Nome: " + json.produto_nome);
document.write("Preço: " + json.produto_preco);
document.write("Data: " + json.produto_data);
    
05.04.2014 / 05:35