Recepción de datos meadiante AJAX/JSON

[SrVory]

Buenas, verán, tengo un codigo en javascript el cual me pregunta por un alert un nombre y se me genera una div con id de ese nombre, tambien ese div tiene coordenadas, las coordenadas y su id se guardan en un archivo mediante AJAX y PHP. Necesito saber como puedo hacer que, a parte de que se generen esas divs, me recoja el array guardado en un archivo mediante php y también me genere otra con el array guardado en un archivo. Es decir recoger los datos del array y generar una div con esos datos guardados.

Codigo javascript:

Código:

function enviar() {
    //Que datos queremos enviar al php
    var playerPosX = parseInt(document.getElementById(player).style.left);
    var playerPosY = parseInt(document.getElementById(player).style.top);
    var playerSize = parseInt(document.getElementById(player).style.height);
          
// Definimos la URL que vamos a solicitar via Ajax
    var phpFile = "js/manager.php";

// Definimos los parámetros que vamos a enviar
    var paramPlayerPosX = "playerPosX=" + playerPosX;
    var paramPlayerPosY = "playerPosY=" + playerPosY;
    var paramPlayerSize = "playerSize=" + playerSize;
    var paramPlayername = "playername=" + player;

// Creamos un nuevo objeto encargado de la comunicación
    var ajax_request = new XMLHttpRequest();

// Definimos como queremos realizar la comunicación
    ajax_request.open("POST", phpFile, true);

// Ponemos las cabeceras de la solicitud como si fuera un formulario, necesario si se utiliza POST    
    ajax_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

    ajax_request.onreadystatechange = function () {

        // readyState es 4
        if (ajax_request.readyState === 4 && ajax_request.status === 200) {
            //Se ejecuta cuando recibe los datos del php.
//            if (ajax_request.responseText === player) {
//                console.log("Nombre jugador = " + player);
//            }
        }
    };



//Enviamos la solicitud junto con los parámetros
    ajax_request.send(paramPlayerSize + "&" + paramPlayerPosX + "&" + paramPlayerPosY + "&" + paramPlayername + "&accion=guardar");

}

function leer() {
    //Que datos queremos enviar al php
    var phpFile = "js/manager.php";
    // Creamos un nuevo objeto encargado de la comunicación
    var ajax_request = new XMLHttpRequest();
// Definimos como queremos realizar la comunicación
    ajax_request.open("POST", phpFile, true);
// Ponemos las cabeceras de la solicitud como si fuera un formulario, necesario si se utiliza POST    
    ajax_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    ajax_request.onreadystatechange = recibir;
//Enviamos la solicitud junto con los parámetros
    ajax_request.send("accion=leer");


    function recibir() {

    if (ajax_request.readyState === 4 && ajax_request.status === 200) {
        //Se ejecuta cuando recibe los datos del php.
        var arr_total_Player = JSON.parse(ajax_request.responseText);
        document.getElementById("main").innerHTML = arr_total_Player[0];
        
    }

}

}

function enviando() {
    setInterval("enviar()", 100);
    setInterval("leer()", 100);
}

window.onload = function () {
    enviando();
    
}

Código PHP:

Código PHP:

  function parseRequest() {    
    
    $_accion = $_REQUEST["accion"];
    switch ($_accion){
        case "guardar":
            $posx=$_REQUEST["playerPosX"];
            $posy=$_REQUEST["playerPosY"];
            $playername = $_REQUEST["playername"];
            $playerSize = $_REQUEST["playerSize"];
            $arrPlayer=[$playerSize,$posx,$posy,$playername];
            Serializer::save($arrPlayer, $playername);
            return $playername;
            break;
        case "leer":
            $arr_total_Player = [];
            $arr = (array) Serializer::showIds();
            for($i=0; $i < count($arr); $i++){
                $obj = Serializer::restore($arr[$i]);
                $arr_total_Player.push($obj);
            }
            echo json_encode($arr_total_Player);
            break;
    }
    
}
 
echo parseRequest(); 
   

Código html: (todo se me genera en el div "main")

Código HTML:

<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script src="js/main.js" type="text/javascript"></script>
        <link href="css/main.css" rel="stylesheet" type="text/css"/>
        <link href="images/favicon.ico" rel="shortcut icon" type="image/x-icon">
    </head>
    <body>
        <div id="main">
            
        </div>
    </body>
</html> 

[Alexis88]

En el caso de "leer", también deberías retornar al JSON y no imprimirlo puesto que la impresión se realiza luego de llamar a la función.

Un saludo