Question

Estoy haciendo una web de chats y necesito saber cómo pasar los datos de un formulario php a un archivo json. Si teneis alguna idea, responded, muchas gracias.

Comments

Hola!

Lo que querés es descargar los datos del formulario a un archivo .json?
Eso es parecido a descargar la página actual desde javascript. El algoritmo es muy parecido. Si es eso, es muy fácil. Si queres te doy un ejemplo con el código fuente y te lo explico.

Saludos!

Answer 1

Hola!

Como dije en el comentario anterior, es un algoritmo muy sencillo y te lo dejo aca:

        <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
        <!-- Aca tenemos un formulario cualquiera. Este formulario, con id "holamundo", solo tiene un campo con nombre "hola" y valor "mundo"-->
        <form action="?" id="holamundo">
            <input type="text" name="hola" value="mundo">
            <input type="submit">
        </form>
        <script>
            // Esta función se encargar de transformar el formulario a un archivo json
            function form2json(formID) {
                // Obtenemos el objeto DOM del formulario
                var form = document.getElementById(formID);

                // Obtenemos un objeto que contiene los campos del formulario, usando la función de Jquery "serializeArray" y luego los transformo en un objeto en el que los atributos "name" de cada campo del formulario pasan a ser las claves del objeto; y los "value" los valores.
                var serializedForm = $(form).serializeArray().reduce(function(result, field){
                    if (result.hasOwnProperty(field.name)) {
                        if (Array.isArray(result[field.name])) {
                            result[field.name].push(field.value);
                        } else {
                            result[field.name] = [result[field.name], field.value];
                        }
                    } else {
                        result[field.name] = field.value;
                    }
                    return result;
                }, {});

                // Transformo los campos a una cadena JSON
                var jsonForm = JSON.stringify(serializedForm);

                // Agrego el tipo MIME del archivo y la codificación de caracteres
                var jsonFileData = 'data:application/json;charset=UTF-8,';

                // Codifico la cadena JSON con la función "encodeURIComponent" para que pueda ser parte del atributo "href" y luego lo agrego.
                jsonFileData += encodeURIComponent(jsonForm);

                // Devuelvo el resultado
                return jsonFileData;
            }
        </script>
        <!-- Este link por si solo no hace nada. Pero con el evento "click", cambia el atributo "href" por el contenido del archivo, que se obtiene al llamar a la funcion "form2json". El atributo "href" no solo puede contener links; tambien puede contener archivos, indicando tipo de archivo y codificación de caracteres (si es archivo de texto). El atributo "download" indica el nombre del archivo. -->
        <a href="#" onclick="this.href=form2json('holamundo')" download="holamundo.json">Descargar formulario</a>

Saludos!