Fecha y hora actual: Miércoles 14 Nov 2018 00:45
Índice del Foro

Foros de programación informática, diseño gráfico y Web

En esta comunidad intentaremos dar soporte de programación a todos los niveles, desde principiantes a profesionales de la informática, desarrollo de programas, programación web y mucho más.

Generar JSON anidado con esta estructura

Responder al Tema

Índice del Foro > JavaScript > Generar JSON anidado con esta estructura

Autor Mensaje
elmoyer



Registrado: 25 Ago 2018
Mensajes: 1

Mensaje Publicado: Sábado 25 Ago 2018 13:03

Título del mensaje: Generar JSON anidado con esta estructura

Responder citando

Hola buenas,

estoy intentando aprender un poco mas de JS y su manejo de JSON. Sin embargo esty intentando generar un JSON con una estructura concreta y por ahora me estoy volviendo loco.

La estructura que quiero es esta:

Código:
  1.  
  2. {
  3. "Nombre película":"spiderman",
  4. "num_de_secuelas":3,
  5. "secuelas":[
  6. {
  7. "nombre de la secuela":"nombre 1",
  8. "path":"/user/home/peliculas/Spiderman/nombre1",
  9. "start":"minuto de la primera escena (omite el opening)",
  10. "end":"Hora/minuto del final de la ultima escena (omite los créditos finales)"
  11. },
  12. {
  13. "nombre de la secuela":"nombre 2",
  14. "path":"/user/home/peliculas/Spiderman/nombre2",
  15. "start":"minuto de la primera escena (omite el opening)",
  16. "end":"Hora/minuto del final de la ultima escena (omite los créditos finales)"
  17. },
  18. {
  19. "nombre de la secuela":"nombre 1",
  20. "path":"/user/home/peliculas/Spiderman/nombre1",
  21. "start":"minuto de la primera escena (omite el opening)",
  22. "end":"Hora/minuto del final de la ultima escena (omite los créditos finales)"
  23. }
  24. ]
  25. }
  26.  


Todo ocurre a través de un html en el que el usuario va introduciendo inputs. El html que tengo es este actualmente es este:


Código:
  1. <!DOCTYPE html>
  2.  
  3.  
  4. <title>Testing</title>
  5.  
  6. </head>
  7.  
  8. pelicula : <input type="text" id="pelicula_nombre" >Secuelas : <input type="number" id="secuela" > Folder : <input type="text" id="path" >
  9. <button type="button" onclick="createJson()">Create JSON</button>
  10. var Pelicula_json = [];
  11.  
  12. function createJson() {
  13. var pelicula_nombre = document.getElementById("pelicula_nombre").value;
  14. var secuela = document.getElementById("secuela").value;
  15. var path = document.getElementById("path").value;
  16.  
  17. var parts = [];
  18. for (var i = 0; i < secuela; i++) {
  19. var part = {
  20. "part_name": "Secuela 1",
  21. "carpeta": "ruta"
  22. };
  23. parts.push(part);
  24. }
  25.  
  26. var pelicula = {
  27. "pelicula_nombre": pelicula_nombre,
  28. "secuela": secuela,
  29. "path": path,
  30. "parts": parts
  31. }
  32. Pelicula_json.push(pelicula);
  33. console.log("Pelicula json = ", Pelicula_json);
  34. }
  35. </script>
  36. </body>
  37.  
  38. </html>



Lo que pretendo es que basandonos en el numero introducido en secuelas, se generen los subcampos de carpeta, nombre de la secuela... de forma dinámica.

Para eso he encontrado este código que no sé como implementar:
Código:
  1.  
  2. <script type='text/javascript'>
  3. function addFields() {
  4. // Number of inputs to create
  5. var number = document.getElementById("parts").value;
  6. // Container <div> where dynamic content will be placed
  7. var container = document.getElementById("container");
  8. // Clear previous contents of the container
  9. while (container.hasChildNodes()) {
  10. container.removeChild(container.lastChild);
  11. }
  12. for (i = 0; i < number; i++) {
  13. // Append a node with a random text
  14. container.appendChild(document.createTextNode("Part " + (i + 1)));
  15. // Create an <input> element, set its type and name attributes
  16. var input = document.createElement("input");
  17. input.type = "text";
  18. input.name = "wave-name" + i;
  19. container.appendChild(input);
  20. // Append a line break
  21. container.appendChild(document.createElement("br"));
  22. }
  23. }
  24. </script>
  25. </head>
  26.  
  27. <input type="text" id="wave-name" name= "wave-name" value="">Wave Name<br>
  28. <input type="number" id="parts" name="parts" value="">Number of Parts<br >
  29. <button id="filldetails" onclick="addFields()" style="background-color:green">Fill Details</button>
  30. <div id="container" >
  31. </body>
  32.  
  33. </html>


¿Alguna ayuda?

Gracias de antemano!! :D
Un saludo!

Volver arriba
Ver perfil del usuario Enviar mensaje privado
Responder al Tema
Mostrar mensajes anteriores:   
Ir a:  
Todas las horas están en GMT + 2 Horas

Temas relacionados

Tema Autor Foros Respuestas Publicado
El foro no contiene ningún mensaje nuevo

[C] Como se libera la memoria en estructura din...

DanielC C, C#, Visual C++ 1 Miércoles 11 Ene 2017 22:32 Ver último mensaje
El foro no contiene ningún mensaje nuevo

Ciclo for anidado en while

stifftico97 Excel 0 Miércoles 30 Nov 2016 18:29 Ver último mensaje
El foro no contiene ningún mensaje nuevo

Ciclo for anidado en while

stifftico97 Excel 0 Miércoles 30 Nov 2016 18:28 Ver último mensaje
El foro no contiene ningún mensaje nuevo

Ciclo for anidado en while

stifftico97 Excel 0 Miércoles 30 Nov 2016 18:28 Ver último mensaje
El foro no contiene ningún mensaje nuevo

¿En qué CMS programo esta web?

Eduwebs CMS 1 Viernes 24 Jul 2015 11:43 Ver último mensaje
Panel de Control
No puede crear mensajes, No puede responder temas, No puede editar sus mensajes, No puede borrar sus mensajes, No puede votar en encuestas,