1

Llevo varios días buscando una posible solución a este problema, tengo un formulario con múltiples campos hecho en HTML, en el cual al hacer click en el botón de SUBMIT me toma los valores de cada uno de sus inputs y lo mete en un array

0: "2"
1: "105920808"
2: "Carlos Briceño"
3: "212135"
4: "[email protected]"
5: "3213asdasdas"
6: "[email protected]"
7: "87047866"
8: "87047866"
9: "1"
10: "55"
11: "8"
12: "Urbanizacion Las Lomas"
13: "Alto de Guadalupe, Urbanización las Lomas"
14: "324131"
15: "pass1 "
16: "444444444444"
17: "1231"
18: "321"
19: "32"
20: "1"
21: "1"
22: "98"
23: "Carlos"
24: "0"
25: "[email protected]"
26: "24402969"
27: "87047866"
28: "0"
29: "0"
30: "0"
31: ""
32: ""
33: "1231132"
34: "Cambiar AE"
35: "02"
36: "CRC"
37: "01"
38: "565.28"
39: "01"
40: (9) ["1", "123456", "1", "I", "100000", "Linea 1", "", "", "08"]
41: (9) ["1", "10101", "1", "Alc", "20000", "linea 2 ", "10", "", "08"]
42: "This is a test"
43: "118000"
44: ""
45: ""
46: ""
47: ""
48: ""
49: "118000"
50: ""
51: ""
52: "2000"
53: "118000"
54: "116000"
55: ""
56: ""
57: "133340"

Lo que necesito es que al dar click en submit se genere un archivo XML y se guarde en disco con una estructura específica, llevo rato averiguando pero parece no haber mucha información al respecto. El resultado esperado sería algo parecido a esto.

<?xml version="1.0"?>
<people>
  <person first-name="eric" middle-initial="H" last-name="jung">
    <address street="321 south st" city="denver" state="co" country="usa"/>
    <address street="123 main st" city="arlington" state="ma" country="usa"/>
  </person>

  <person first-name="jed" last-name="brown">
    <address street="321 north st" city="atlanta" state="ga" country="usa"/>
    <address street="123 west st" city="seattle" state="wa" country="usa"/>
    <address street="321 south avenue" city="denver" state="co" country="usa"/>
  </person>
</people>

Me he documentado con esta web https://developer.mozilla.org/en-US/docs/Web/API/Document_object_model/How_to_create_a_DOM_tree . En la cual explican muy bien como generar una estructura XML sin, embargo no logro que se me guarde en disco un archivo

6
  • <?xml version="1.0"?> <people> <person first-name="eric" middle-initial="H" last-name="jung"> <address street="321 south st" city="denver" state="co" country="usa"/> <address street="123 main st" city="arlington" state="ma" country="usa"/> </person> <person first-name="jed" last-name="brown"> <address street="321 north st" city="atlanta" state="ga" country="usa"/> <address street="123 west st" city="seattle" state="wa" country="usa"/> <address street="321 south avenue" city="denver" state="co" country="usa"/> </person> </people> Commented el 11 mar. 2020 a las 19:38
  • 1
    Por favor, edita la pregunta y agrega la nueva información en la misma. Sería mas útil que agregues el código que genera el XML
    – Marcos
    Commented el 11 mar. 2020 a las 19:40
  • Sería un XML simple como ese, perdon por el formato de la pregunta de arriba, no se como orgarnizarlo. He visto en varios sitios como W3schools y developer Mozilla pero aun no veo como hacerlo Commented el 11 mar. 2020 a las 19:40
  • Ok amigo ya la edito Commented el 11 mar. 2020 a las 19:41
  • Ya la he editado Marcos, ocuparía algo parecido a lo que esta en el ejemplo, solo que no se como hacer para que al presionar submit se me guarde en un archivo. Lo ideal sería llenar el archivo XML con la informacion de mi formulario o en defecto con la del array. Pero sería de gran ayuda que me guiaras para poder guardar un archivo como ese Commented el 11 mar. 2020 a las 19:53

1 respuesta 1

1

La forma más simple es crear dinámicamente un elemento a al cual le indicamos en el href el contenido del XML

Ejemplo:

function downloadFile() {

  let filename = 'people.xml';
  let text = '<?xml version="1.0"?> <people> <person first-name="eric" middle-initial="H" last-name="jung"> <address street="321 south st" city="denver" state="co" country="usa"/> <address street="123 main st" city="arlington" state="ma" country="usa"/> </person> <person first-name="jed" last-name="brown"> <address street="321 north st" city="atlanta" state="ga" country="usa"/> <address street="123 west st" city="seattle" state="wa" country="usa"/> <address street="321 south avenue" city="denver" state="co" country="usa"/> </person> </people>';

  let element = document.createElement('a');
  element.setAttribute('href', 'data:text/xml;charset=utf-8,' + encodeURIComponent(text));
  element.setAttribute('download', filename);

  element.style.display = 'none';
  document.body.appendChild(element);

  element.click();

  document.body.removeChild(element);
}
<form onsubmit="downloadFile()">
  <input type="submit" value="Download">
</form>

Referencias:

5
  • Broo, muchisimas gracias, aceptaría tu pregunta pero no tengo suficiente reputación, te lo agradezco un monton Commented el 11 mar. 2020 a las 20:01
  • Aceptar respuestas te da reputación. Ademas es tú pregunta y solo vos la podes "aceptar". Votar la puede votar cualquier usuario registrado. Revisa ¿Qué debo hacer cuando alguien contesta mi pregunta? si tenes alguna duda
    – Marcos
    Commented el 11 mar. 2020 a las 20:03
  • Aceptada, aun no me manejo muy bien aquí, aceptarla es lo menos que puedo hacer, gracias de verdad!!! Commented el 11 mar. 2020 a las 20:05
  • En caso de que llenar la estructura xml con los datos del array sabrías como? Commented el 11 mar. 2020 a las 21:37
  • Seria bueno que primero lo intentes hacer vos. Si no te sale, entonces podes crear una nueva pregunta incluyendo lo que hiciste y el problema que se te presento.
    – Marcos
    Commented el 12 mar. 2020 a las 15:40

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.