JSON数据无法从Ajax调用正确返回

时间:2019-04-04 19:05:43

标签: php jquery json

在此HTML代码中,当输入字段“ nu_protocolo”失去焦点时,Ajax代码将调用php脚本 ajax.getting_data.php

HTML代码:

form.html

<script type="text/javascript">      

    $(document).ready(function() {
        $("#nu_protocolo").focusout(function() {
            var dados = 'protocolo=' + $(this).val();

            $.ajax({
                type:           'POST',
                dataType:       'text',
                async:          true,
                url:            'ajax.getting_data.php',
                data:           dados,
                success: function (response) {                        
                    console.log(response);
                }
            });
        });
    });

</script>

<!-- Form Content  -->
<div id="content">
    <form id="form_requisicao" class="form-horizontal" action="" method="POST">
        <div class="form-group mostra_protocolo">
            <label for="nu_protocolo" class="control-label col-md-4">Número Protocolo:</label> 
            <div class="col-md-2">
                <input type="text" id="nu_protocolo" name="nu_protocolo" placeholder="Número Protocolo" type="text" class="form-control input-protocolo">
            </div>
        </div>
    </form>
</div>

PHP代码:

ajax.getting_data.php

    <?php
    ...
    ...

    $empregados = 
        array(
            'quantidade'                    => $qt_estagiarios,
            'protocolo_ano'                 => $estagiario_prot_ano,
            'protocolo_origem'              => $estagiario_prot_origem,
            'protocolo_numero'              => $estagiario_prot_numero

        );

    $rs = json_encode($empregados, JSON_PRETTY_PRINT);
    echo $rs;

PHP代码的输出为:

JSON数据:

    {
    "quantidade": "2",
    "protocolo_ano": "25",
    "protocolo_origem": "40",
    "protocolo_numero": "65000"
    }

在HTML代码中显示控制台数据,您将获得与硬编码PHP代码相同的JSON数据。问题是当您指定类似“ quantidade”的变量时。给我显示在控制台上的 undefined 值。 我尝试了多种方法来指定变量,但没有得到任何结果:

form.html

       ...
       ...
            success: function (response) {                        
                console.log(response.quantidade);
                console.log(response[0].quantidade);
                console.log(response[0]);
            }
       ...
       ...

2 个答案:

答案 0 :(得分:2)

您需要在dataType: 'text',调用中将dataType: 'json',更改为$.ajax({...}),因为它定义了响应预处理类型http://api.jquery.com/jquery.ajax/#data-types

答案 1 :(得分:0)

您需要确保jQuery将JSON视为JSON。

默认情况下,PHP声称它输出HTML,因此您需要:

header("Content-Type: application/json"); 

…表示您正在发送JSON。


那么你有这个:

dataType:       'text',

…告诉jQuery忽略Content-Type标头,并将响应视为纯文本。

因此将其删除(或将其更改为dataType: 'json',以告诉jQuery忽略Content-Type并将响应视为JSON。