Unexpected behaviour of Ajax

Question

I recently began to learn TypeScript and PHP, and I'm came across some weird result when using AJAX. I have the typical HTML form to send data to a PHP script, but instead of using the submit type in the form, I call a function built in TypeScript (and transpiled to JS) to check if the data in the form is correct (validate for empty strings etc etc) and then send all that info to the PHP script. For testing purposes I sent to the PHP script, via POST, only one value, to check if everything was working as it should. THe result I was hoping for was an alert in the browser with the value of the data I passed using AJAX, but, instead of that, I got an alert with all the contents of the PHP script, and I have no idea why.

Here is the code so far:

This is the function who handles the AJAX request

function sendData(sueldo:number){

let xhttp : XMLHttpRequest =  new XMLHttpRequest();
xhttp.open("POST", "./administracion.php", true);
xhttp.setRequestHeader("content-type","application/x-www-form-urlencoded");

xhttp.send("sueldo="+sueldo);

xhttp.onreadystatechange = () => {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
        alert(xhttp.responseText);
    }
}

And this is the PHP script that receive that request

<?php
if(isset($POST['sueldo']))
{
    echo "Valor recuperador por POST: " . $POST['sueldo']; 
}

?>

And this is the result I get when I submit the data in the form:

Any help is greatly appreciated

Thanks!