Request ajax does not return what I want

Question

I have a registration page with a form, the person type the year and click on the button to find the registration. With the typed year I have to make the request for PHP to execute the query, return the data and distribute the data to the form fields.

I’m trying to make a simple requisition. The page takes the base year of the form and sends a request with the base year returning the query result within PHP. I have no experience with HTML, PHP or javascript and after weeks studying how to do this I’ve come this far. The request executes and returns, but the result is not what I want. Using $.post the output in alert (I’m going to print the result to see if you return what I want, I will treat the data of the query by distributing them one for each field of the form) is the PHP code of the query.php instead of running and returning the query. I tried using $.ajax and the result was even more bizarre because it not only runs query.php, but returns the HTML code of the page itself. I tried using Xmlhttprequest() and also returns the code instead of running. I don’t know what I’m doing wrong. Help...

Edited: I fixed the code with the $_POSTand the tag <?php and the request worked. The problem now is simply to process the data. I don’t know how to return or how to handle it. Summarizing: I have the request that makes the query in the BD and returns to the page. The request does not return (or does not execute, I do not know). O alert of $.post does not perform when I use json_encode. If I return text he only returns array (I saw the variable by F12 and Alert printa this too). What I need is that at the end of everything I have an array (or something easy to separate) to assign each column value consulted in the BD to the specific HTML field.

Using $.post:

$.post("query.php", {ano_ref: ano_base},
      function(retorno){
    alert(retorno);
}, "json");

With $.ajax it was like this:

$.ajax({
    type: "POST",
    URL: "query.php",
    datatype: "json",
    data:{ano_ref: ano_base},
    success: function (resposta){
        alert(resposta);            },
    error: function(){
        alert("erro de req.");
    }       
})

Using Xmlhttprequest:

var xhttp;
if (window.XMLHttpRequest) {
    xhttp = new XMLHttpRequest();
    } else {
    // code for IE6, IE5
    xhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("POST", "query.php", true);
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        alert(this.responseText);
    }
};

xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
var string = "ano_ref=" + encodeURIComponent(ano_base.toString());
alert(string);
xhttp.send(string);

The query.php:

<?php

    include("conexao_postgres.php");

    $ano_base = $_POST["ano_ref"];

    $sql = "SELECT * FROM public.parametros_estaduais WHERE ano_base = $ano_base";
    $resultado = pg_query($dbconn, $sql);
    $resultado_array = pg_fetch_row($resultado, 0); // ($resultado)

    echo json_encode($resultado);
?>

Taking advantage, I can return a simple array or just the json really? Treat the json is very difficult? As I said, each of these query columns goes to a form field, that’s all.

Answer 1

The situation requires good debugging. Use the browser debug tools to see which errors the php page is returning. In the most famous browsers, right-click --> inspect element --> network tab. So you can see both errors returned by php code, and javascript.