Mensajes

Muchas gracias, he utilizado la opcion que me distes, lo organize a lo que necesitaba y ya me esta dando!.

[Yo requiero es que si le undo a Curso 1, el me muestre de manera ordenada en una tabla todos los capitulos de ese curso y sus videos, de la siguiente manera.]

 Buenas noches, hoy vengo a pedir su apoyo para un problema que me esta doliendo la cabeza (Por el poco conocimiento que he tenido, el cual estoy aprendiendo).
INTRODUCCION:

Estoy haciendo una pequeña vista con html, donde introduzco unos datos que vienen en formato (json), usando (ajax). Son datos de unos cursos los cuales vienen con los capitulos y sus respectivos videos.
CODIGO JSON:

Código (javascript) [Seleccionar] Expandir


{
 "courses": [
  {
     "name": "Programming - Android Leveraging the power of the android platform",
     "color": "#BCCEF4",
     "list":
     [
      {
"chapter":"Leveraging the power of the android platform",
"videos":[
           {
           "name":" Understanding the android threading model",
           "video":"programming/Android/Leveraging the power of the android platform/1. Understanding the android threading model.mkv",
           "subtitle":"file.vtt"
            },
           {
           "name":" Performing Background work with Services",
           "video":"programming/Android/Leveraging the power of the android platform/2. Performing Background work with Services.mkv",
           "subtitle":"file.vtt"
           },
           {
           "name":" Scheduling Background work with jobScheduler",
           "video":"programming/Android/Leveraging the power of the android platform/3. Scheduling Background work with jobScheduler.mkv",
           "subtitle":"file.vtt"
           },
           {
           "name":" working with Broadcast Receivers",
           "video":"programming/Android/Leveraging the power of the android platform/4. working with Broadcast Receivers.mkv",
           "subtitle":"file.vtt"
           },
           {
           "name":" Using Alarms to shedule time-sensitive task",
           "video":"programming/Android/Leveraging the power of the android platform/5. Using Alarms to shedule time-sensitive task.mkv",
           "subtitle":"file.vtt"
           }
       ]
}

     ]
   },
   {
     "name": "Programming - Android Apps with Kotlin- ViewModel and Lifecycle",
     "color": "#BCCEF4",
     "list":
     [
         {
           "chapter":"00. Course Overview",
           "videos":[
               {
               "name":" Course Overview",
               "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/00. Course Overview/00. Course Overview.mp4",
               "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/00. Course Overview/00. Course Overview.vtt"
               }
           ]
          },
          {
           "chapter":"01. Managing Activity State with ViewModel",
           "videos":[
                       {
                       "name":" Introduction",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/00. Introduction.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/00. Introduction.vtt"
                       },
                       {
                       "name":" Activities - More Than Just a Pretty Face",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/01. Activities - More Than Just a Pretty Face.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/01. Activities - More Than Just a Pretty Face.vtt"
                       },
                       {
                       "name":" Managing Activity State with ViewModel",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/02. Managing Activity State with ViewModel.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/02. Managing Activity State with ViewModel.vtt"
                       },
                       {
                       "name":" There's a Bug in Our App",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/03. There's a Bug in Our App.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/03. There's a Bug in Our App.vtt"
                       },
                       {
                       "name":" Adding a ViewModel and Build Dependencies",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/04. Adding a ViewModel and Build Dependencies.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/04. Adding a ViewModel and Build Dependencies.vtt"
                       },
                       {
                       "name":" Accessing Our ViewModel with a Lazy Property",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/05. Accessing Our ViewModel with a Lazy Property.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/05. Accessing Our ViewModel with a Lazy Property.vtt"
                       },
                       {
                       "name":" Restoring the Activity State",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/06. Restoring the Activity State.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/06. Restoring the Activity State.vtt"
                       },
                       {
                       "name":" That Bug's Fixed, but We Just Found Another One",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/07. That Bug's Fixed, but We Just Found Another One.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/07. That Bug's Fixed, but We Just Found Another One.vtt"
                       },
                       {
                       "name":" Managing More Complex State with ViewModel",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/08. Managing More Complex State with ViewModel.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/08. Managing More Complex State with ViewModel.vtt"
                       },
                       {
                       "name":" Verifying App Behavior",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/09. Verifying App Behavior.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/09. Verifying App Behavior.vtt"
                       },
                       {
                       "name":" Summary",
                       "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/10. Summary.mp4",
                       "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/01. Managing Activity State with ViewModel/10. Summary.vtt"
                       }
           ]
           },
           {
               "chapter":"02. Maintaining Activity State during System-initiated Shutdowns",
               "videos":[
                           {
                           "name":" Introduction",
                           "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/00. Introduction.mp4",
                           "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/00. Introduction.vtt"
                           },
                           {
                           "name":" Activity Destruction Effects on State",
                           "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/01. Activity Destruction Effects on State.mp4",
                           "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/01. Activity Destruction Effects on State.vtt"
                           },
                           {
                           "name":" Durable Activity State",
                           "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/02. Durable Activity State.mp4",
                           "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/02. Durable Activity State.vtt"
                           },
                           {
                           "name":" Identifying the Need for Durable State",
                           "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/03. Identifying the Need for Durable State.mp4",
                           "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/03. Identifying the Need for Durable State.vtt"
                           },
                           {
                           "name":" Persisting State of a Simple Value",
                           "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/04. Persisting State of a Simple Value.mp4",
                           "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/04. Persisting State of a Simple Value.vtt"
                           },
                           {
                           "name":" Restoring State of a Simple Value",
                           "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/05. Restoring State of a Simple Value.mp4",
                           "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/05. Restoring State of a Simple Value.vtt"
                           },
                           {
                           "name":" Summary",
                           "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/06. Summary.mp4",
                           "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/02. Maintaining Activity State during System-initiated Shutdowns/06. Summary.vtt"
                           }
               ]
               },
               {
                   "chapter":"03. Persisting Complex Activity State",
                   "videos":[
                               {
                               "name":" Introduction",
                               "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/00. Introduction.mp4",
                               "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/00. Introduction.vtt"
                               },
                               {
                               "name":" We're Still Losing Some of Our Activity State",
                               "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/01. We're Still Losing Some of Our Activity State.mp4",
                               "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/01. We're Still Losing Some of Our Activity State.vtt"
                               },
                               {
                               "name":" Activity State and Data Model Cooperation",
                               "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/02. Activity State and Data Model Cooperation.mp4",
                               "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/02. Activity State and Data Model Cooperation.vtt"
                               },
                               {
                               "name":" Moving the Details to the ViewModel",
                               "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/03. Moving the Details to the ViewModel.mp4",
                               "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/03. Moving the Details to the ViewModel.vtt"
                               },
                               {
                               "name":" Persisting State of an Object Graph",
                               "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/04. Persisting State of an Object Graph.mp4",
                               "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/04. Persisting State of an Object Graph.vtt"
                               },
                               {
                               "name":" Effectively Using ViewModel and Durable State Together",
                               "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/05. Effectively Using ViewModel and Durable State Together.mp4",
                               "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/05. Effectively Using ViewModel and Durable State Together.vtt"
                               },
                               {
                               "name":" Verifying State Management Behavior",
                               "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/06. Verifying State Management Behavior.mp4",
                               "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/06. Verifying State Management Behavior.vtt"
                               },
                               {
                               "name":" Summary",
                               "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/07. Summary.mp4",
                               "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/03. Persisting Complex Activity State/07. Summary.vtt"
                               }
                   ]
                   },
                   {
                       "chapter":"04. Subscribing to Lifecycle Events",
                       "videos":[
                                   {
                                   "name":" Introduction",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/00. Introduction.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/00. Introduction.vtt"
                                   },
                                   {
                                   "name":" Cooperating with Activity Lifecycle",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/01. Cooperating with Activity Lifecycle.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/01. Cooperating with Activity Lifecycle.vtt"
                                   },
                                   {
                                   "name":" Our App's Get-together Feature",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/02. Our App's Get-together Feature.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/02. Our App's Get-together Feature.vtt"
                                   },
                                   {
                                   "name":" Managing Location with Activity Functions",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/03. Managing Location with Activity Functions.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/03. Managing Location with Activity Functions.vtt"
                                   },
                                   {
                                   "name":" Fixing the Location Resource Leak",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/04. Fixing the Location Resource Leak.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/04. Fixing the Location Resource Leak.vtt"
                                   },
                                   {
                                   "name":" Improving Lifecycle Handling with Events",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/05. Improving Lifecycle Handling with Events.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/05. Improving Lifecycle Handling with Events.vtt"
                                   },
                                   {
                                   "name":" Creating a Lifecycle Observer",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/06. Creating a Lifecycle Observer.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/06. Creating a Lifecycle Observer.vtt"
                                   },
                                   {
                                   "name":" Observing Lifecycle Events",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/07. Observing Lifecycle Events.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/07. Observing Lifecycle Events.vtt"
                                   },
                                   {
                                   "name":" Connecting the Observer to the Lifecycle",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/08. Connecting the Observer to the Lifecycle.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/08. Connecting the Observer to the Lifecycle.vtt"
                                   },
                                   {
                                   "name":" Summary",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/09. Summary.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/04. Subscribing to Lifecycle Events/09. Summary.vtt"
                                   }
                       ]
                       },
                       {
                       "chapter":"05. Determining Lifecycle State",
                       "videos":[
                                   {
                                   "name":" Introduction",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/00. Introduction.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/00. Introduction.vtt"
                                   },
                                   {
                                   "name":" Events Are Only Part of the Story",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/01. Events Are Only Part of the Story.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/01. Events Are Only Part of the Story.vtt"
                                   },
                                   {
                                   "name":" Adding the Messaging Manager",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/02. Adding the Messaging Manager.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/02. Adding the Messaging Manager.vtt"
                                   },
                                   {
                                   "name":" Lifecycle-driven Asynchronous Operations",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/03. Lifecycle-driven Asynchronous Operations.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/03. Lifecycle-driven Asynchronous Operations.vtt"
                                   },
                                   {
                                   "name":" We're Leaking Connections",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/04. We're Leaking Connections.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/04. We're Leaking Connections.vtt"
                                   },
                                   {
                                   "name":" Lifecycle State",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/05. Lifecycle State.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/05. Lifecycle State.vtt"
                                   },
                                   {
                                   "name":" Verifying State in Asynchronous Operations",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/06. Verifying State in Asynchronous Operations.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/06. Verifying State in Asynchronous Operations.vtt"
                                   },
                                   {
                                   "name":" The Leak Is Fixed",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/07. The Leak Is Fixed.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/07. The Leak Is Fixed.vtt"
                                   },
                                   {
                                   "name":" Summary",
                                   "video":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/08. Summary.mp4",
                                   "subtitle":"programming/Android/Android Apps with Kotlin- ViewModel and Lifecycle/05. Determining Lifecycle State/08. Summary.vtt"
                                   }
                       ]
                       }
     ]
   }
 ]
}

PD: El archivo JSON tiene 5 cursos y cada uno sus capitulos y videos correspondientes, realmente seria un archivo muy largo pero subo un ejemplo de esos para poder entender como podria resolverlo con dos cursos.
CODIGO AJAX

Código (javascript) [Seleccionar] Expandir


let nombreCursos, cantidadCursos, i, datos, datosRecibidos, cantidadCapitulos;
let cantidadVideos, texto, texto2;
const xhttp = new XMLHttpRequest();
xhttp.open('GET', 'js/provider.json', true);
xhttp.send();
xhttp.onreadystatechange = function(response){
   if(this.readyState == 4 && this.status == 200){
       //console.log(this.responseText);
       datos = JSON.parse(this.responseText);
       if (xhttp.readyState==4 && xhttp.status==200) {
           datosRecibidos = datos.courses;
           for (i=0; i<datosRecibidos.length;i++) {
               cantidadCursos = [i];
               nombreCursos = datosRecibidos[i]['name'];
               cantidadCapitulos = datosRecibidos[i]['list'].length;
               cantidadVideos = datosRecibidos[i]['list'];
               texto = JSON.stringify(nombreCursos);
               texto2 = JSON.stringify(cantidadVideos);
               $("#videos").append("<tr><td>"+texto+"</td><td>"+texto2+"</td></tr>");
               
           }
       }
   }
}




PROBLEMA:
Si yo tengo un menu como el siguiente..

Yo requiero es que si le undo a Curso 1, el me muestre de manera ordenada en una tabla todos los capitulos de ese curso y sus videos, de la siguiente manera.



Si yo le undo a Curso 2, el va a ocultar el curso 1 y los demas y solo dejara visible el curso seleccionado.
Realmente no estoy pidiendo que me den todas las respuestas al problema, si no que me ayuden a entender como podria resolverlo, o que temas podrian servirme para poder entender bien como poder hacerlo, estoy aprendiendo y todo lo que me sirva a mi aprendizaje es bueno.

PD: No se si me estoy enredando o la respuesta puede estar en lo que ya hice con el for, pero realmente no he entendido bien como poder resolver esa ultima parte, Gracias a aquel que me pueda colaborar.

Buenas a todos, les pido el favor para una colaboracion para un tema que estoy haciendo y no se como solucionarlo.
ESTE ES EL INDEX:

Resulta que estoy realizando un formulario donde digito informacion acerca del usuario que voy a ingresar, el numero de factura, iva, fecha de creacion de la factura y fecha de entrega. Esa informacion no necesito repetirla, porque es unica.
Pero la informacion que tengo a la izquierda es el codigo y cantidad del producto que deseo anotar, Ahora.. Abajo tengo un boton llamado "+", el cual se encarga de cojer esos dos inputs del lado de la izquierda y repetirlos, para poder digitar otros codigos de productos, y todo eso me da normal...
El problema que veo es que al momento de yo mandar los datos a travez del boton "Submit", el los manda pero no se como hacer para que en el sistema del INSERT se pueda digitar las variables que ya estan asociadas (Numero de factura, Usuario, Iva, Fecha de Creacion y Entrega), con las que estoy repitiendo (Codigo y Cantidad).

PD: Ya encontre como mandar un grupo de array por php a mysql que seria asi

Código (php) [Seleccionar] Expandir

<?php
session_start();
include("../conexion_mysql.php");
$numfact = $_POST['numfact'];
$codigo  = $_POST['codigo'];
$cantid  = $_POST['cantidad'];
$usuari  = $_POST['user'];
$iva   = $_POST['iva'];
$fc   = $_POST['fc'];
$fe   = $_POST['fe'];
$vtotal  = 0;
$cadena  = "INSERT INTO factura (num_factura, codigo, usuario, cantidad, iva, fechacrea, fechaentre, vtotal) VALUES ";

for ($i=0; $i < count($codigo); $i++) { 
$cadena.= "(".$numfact[$i]."', '".$codigo[$i]."', '".$usuari[$i]."', '".$cantid[$i].",".$iva[$i]."', '".$fc[$i]."', '".$fe[$i]."', '".$vtotal[$i]."'),";
}

echo json_encode(array('cadena' => $cadena));
$cadena_final = substr($cadena, 0,-1);
$cadena_final.=";";
$sql = mysqli_query($conectar, $cadena_final);
if ($sql) {
header("location:index.php");
}else {
echo 'Error';
}
$mysqli = mysqli_close($conectar);

?>

Pero ovbiamente al momento de mandar me sale un error que este.

Código [Seleccionar] Expandir

<br />
<b>Notice</b>:  Trying to access array offset on value of type int in <b>/opt/lampp/htdocs/MiPagina/php/Facturacion/validarfactu.php</b> on line <b>15</b><br />
<br />
<b>Notice</b>:  Undefined offset: 1 in <b>/opt/lampp/htdocs/MiPagina/php/Facturacion/validarfactu.php</b> on line <b>15</b><br />
<br />
<b>Notice</b>:  Undefined offset: 1 in <b>/opt/lampp/htdocs/MiPagina/php/Facturacion/validarfactu.php</b> on line <b>15</b><br />
<br />
<b>Notice</b>:  Undefined offset: 1 in <b>/opt/lampp/htdocs/MiPagina/php/Facturacion/validarfactu.php</b> on line <b>15</b><br />
<br />
<b>Notice</b>:  Undefined offset: 1 in <b>/opt/lampp/htdocs/MiPagina/php/Facturacion/validarfactu.php</b> on line <b>15</b><br />
<br />
<b>Notice</b>:  Undefined offset: 1 in <b>/opt/lampp/htdocs/MiPagina/php/Facturacion/validarfactu.php</b> on line <b>15</b><br />
<br />
<b>Notice</b>:  Trying to access array offset on value of type int in <b>/opt/lampp/htdocs/MiPagina/php/Facturacion/validarfactu.php</b> on line <b>15</b><br />
{"cadena":"INSERT INTO factura (num_factura, codigo, usuario, cantidad, iva, fechacrea, fechaentre, vtotal) VALUES ('01', '1234', 'usuario', '5,5', '2020-02-08', '2020-02-20', ''),('', '1235', '', '6,', '', '', ''),"}

Utilizo Jquery por el metodo JSON para mandar los datos de html a php
el HTML es este:

Código (html4strict) [Seleccionar] Expandir

<section class="cuerpo">
<form method="POST" action="validarfactu.php" class="factura">
<div class="container">
<div class="row">
<div class="col-12 col-sm-6">
<br><label for="nf">Numero de Factura</label>
    <br><input type="number" id="nf" name="numfact[]">
    <br><label for="code">Cliente</label>
    <br><select name="user[]">
    <option>Seleccione el cliente</option>
    <?php 
     $sql = "SELECT usuario FROM usuario";
     $consulta = mysqli_query($conectar, $sql);
     while ($mover = mysqli_fetch_array($consulta)){
     ?>
    <option value="<?php echo $mover['usuario']; ?>"><?php echo $mover['usuario']; ?></option>
    <?php }?>
    </select>
    <br><label for="iva">IVA</label>
    <br><input type="number" id="iva" name="iva[]">
    <br><label for="fc">Fecha de Creacion</label>
    <br><input type="date" id="fc" name="fc[]">
    <br><label for="fe">Fecha de Entrega</label>
    <br><input type="date" id="fe" name="fe[]">
</div>

<div class="col-12 col-sm-6 repetido">
    <label for="code">Codigo</label>
    <br><input id="code" type="number" name="codigo[]">
    <br><label for="cantidad">Cantidad</label>
    <br><input type="number" id="cantidad" name="cantidad[]">
</div>
  <button type="submit" class="btn btn-primary submit">Submit</button>
</div>
</div>
</form>
<center><input type="submit" id="agregar" value="+"></center>
</section

el Jquery

Código (javascript) [Seleccionar] Expandir

// CLONAR Y ELIMINAR INPUT

$(document).ready(function(e){
// VARIABLES
var html = '<center><div><label for="code">Codigo</label><br><input id="code" type="number" name="codigo[]"><br><label for="cantidad">Cantidad</label><br><input type="number" id="cantidad" name="cantidad[]"><br> <hr><button id="exit">X</button></div></center>';
// CLONAR
$("#agregar").click(function(){
$(".repetido").append(html);
});
// ELIMINAR
$(".repetido").on('click','#exit',function(){
$(this).parent('div').remove();
});
});



// PETICION TIPO AJAX

jQuery(document).on('submit','.factura',function(event){
event.preventDefault();
jQuery.ajax({
url: 'validarfactu.php',
type: 'POST',
dataType: 'json',
data: $(this).serialize(),
})
.done(function(respuesta){
console.log(respuesta);
if(!respuesta.error) {
alert("Los datos se ingresaron correctamente");
}else {
alert("Los datos NO se ingresaron correctamente");
}
})
.fail(function(resp){
console.log(resp.responseText);
})
.always(function(){
console.log("complete");
})
});

Alguna persona que me pueda colaborar?, por favor gracias 

Buenas tardes, AlbertoBSD. Claro en algunos codigos PHP, tengo incluido codigo para proteger al SQL Injection si no que este es un proyecto personal de aprendizaje que estoy haciendo, soy muy tirado a la practica y aprendiendo poco a poco la teoria hasta que me meta a estudiar la Universidad. Si me puedes ayudar con lo que estoy haciendo mal en el codigo excelente, gracias de todas maneras.

@?0!,5^34. Exacto, yo el CSS y el JS lo tengo dentro de un archivo aparte y los tengo anexados atravez de sus directorios, ese codigo javascript que tenia hay mismo en el documento era porque estaba metiendolo en donde estaban los codigos javascript y no me queria funcionar, pero ya resolvi eso. Ya comente lo de las sentencias preparadas arriba en mi comentario, Lo de parsear el input recibido en PHP y tambien envio para reducir la carga del servidor, eso lo estoy mirando en tutoriales para aprender, pues hay estuve mirando una libreria que uno indexaba al HTML para que hiciera eso de parsear.

Buenas tardes a todos, en el dia de hoy vengo a pedirles una colaboracion con un codigo que no me quiere funcionar.

Tengo una tabla, donde yo quiero clonar la fila dependiendo de si la persona desea agregarlo con un (+), la fila principal tiene una funcion Jquery que hace que al yo digitar un codigo el trae de la base de datos la informacion como (Descripcion y valor unitario) y la pone en el input correspondiente, ahora todo esto me resulta, y todo esta bien. Pero al momento de yo crear una fila nueva el trae por defecto lo que tenga la primer fila, y si yo voy a traer la informacion de un producto por medio del codigo no tiene activado el codigo Jquery, que podria hacer en ese caso?.

CODIGO HTML

Código [Seleccionar] Expandir

<div class="container">
  <div class="row">
    <div class="col-12">
  <form >
   <h3>Agregar Pedido</h3>
<select name="cc" class='mi-selector'>
          <option>Seleccione Cedula:</option>
            <?php
               $sql = "SELECT Cedula FROM Usuario";
               $consulta = mysqli_query($conectar, $sql);
            while ($mostrar = mysqli_fetch_array($consulta)) {
                ?>
          <option value="<?php echo $mostrar['Cedula'];?>"><?php echo $mostrar['Cedula'];?></option>
            <?php }?>
         </select>
    <table class="tabla">
     <tr class="fila-fija">
                  <td><input type="number" name="codigo[]" class="codigo"><span class="resultado"></span></td>
                  <td><input type="text" disabled="" name="descripcion[]" class="descrip" value="" placeholder="Descripcion"></td>           
                  <td><input type="text" name="Unidad[]" placeholder="Unidad"></td>
                  <td><input type="text" name="cantidad[]" placeholder="Cantidad"></td>
                  <td><input type="number" disabled="" name="vunitario[]" class="vunitario" value="" placeholder="Vunitario"></td>
                  <td class="eliminar"><input type="button"   value="Menos -"/></td>
     </tr>
    </table>
      <table>
<tr>
<td><input type="number" name="iva" placeholder="IVA"></td>
<td><input type="date" name="fecha"></td>
</tr>
   </table>
   <div class="btn-der">
     <input type="submit" name="insertar" value="Guardar" class="btn btn-info"/>
     <button id="adicional" name="adicional" type="button" class="btn btn-warning"> Más + </button>
   </div>
  </form>
</div>
</div>
</div>

JS:

Código [Seleccionar] Expandir

<script type="text/javascript">
  // RELLENAR CAMPOS
$(document).ready(function() {
$(".codigo").focus();
$(".codigo").keydown(function(e) {
  ;
var url="getdatos.php";
$.getJSON(url,{ _num1: $(".codigo").val() }, function(clientes){
$.each(clientes, function(i,cliente) {
$(".vunitario").val(cliente.vunitario);
$(".descrip").val(cliente.descripcion);

if(cliente.resultado == "2") {
  $(".resultado").css("color","red");
  $(".resultado").text("codigo no disponible");
} else {
  $(".resultado").css("color","green");
  $(".resultado").text("codigo disponible");
}
});
});
});
});
</script>

// CLONAR UN INPUT
        $(function(){
// Clona la fila oculta que tiene los campos base, y la agrega al final de la tabla
$("#adicional").on('click', function(){
$(".tabla tbody tr:eq(0)").removeClass('fila-fija').clone(true).appendTo(".tabla");
});
// Evento que selecciona la fila y la elimina
$(document).on("click",".eliminar",function(){
var parent = $(this).parents().get(0);
$(parent).remove();
});
});


PHP: TRAER LOS DATOS PARA RELLENARLOS

Código [Seleccionar] Expandir

<?php
$cod = $_GET['_num1'];
if (!empty($cod)) {
    comprobar($cod);
}
function comprobar($cod)
{
    include("../conexion_mysql.php");
    $sql = "SELECT * FROM Productos WHERE Codigo = '$cod'";
    $consulta = mysqli_query($conectar, $sql);
    $clientes = array();
    $row = mysqli_num_rows($consulta);
    if ($row == 0) {
        $clientes[] = array('codigo' => 'No hay nada', 'descripcion' => 'No hay nada', 'vunitario' => '0', 'resultado' => 2);
    } elseif ($row > 0) {
        while ($contar = mysqli_fetch_row($consulta)) {
            $codigo=$contar[0];
            $descripcion=$contar[1];
            $vunitario=$contar[3];
            $clientes[] = array('codigo' => $codigo, 'descripcion' => $descripcion, 'vunitario' => $vunitario, 'resultado' => 1);
        }
    }
    $json_string = json_encode($clientes);
    echo $json_string;
}
?>

Muchas gracias, espero me puedan colaborar

Buenas noches, quisiera que me ayudaran por favor en lo siguiente:

• Tengo un sistema donde la persona se registra y si todo salio bien le da la opcion de loguearse para entrar a la pagina web, hasta hay todo esta bien.
• Cuando se loguea entra al perfil, y desde hay puede ver las otras opciones que maneja la pagina (menu).
• Lo que deseo es que cuando la persona se registre y se loguee por primera vez, antes de que le aparezca el perfil, tenga que llenar obligatoriamente unos datos para actualizar su perfil como son (nombre, apellido, telefono, direccion, foto de perfil, mensaje personal).
• Cuando la persona digite esta informacion, hay si pueda ver el perfil con todo organizado.
• El problema es que no se como hacer que la imagen pueda ser guardada en la base de datos y adicional como hacer que la persona apenas se registre y loguee por primera vez le aparezca esta pagina como inicio para poder seguir.
• de ante mano les agradezco, manejo un sistema basico de CRUD (html, css, php y mysqli)
• Si necesitan codigos de archivos me dicen cuales o me dicen mas o menos que temas necesito para saber estas dos incognitas que tengo, gracias.

Buenas, el problema es que no tengo relacionado la tabla Clientes con Productos.
La tabla Clientes, tiene 5 atributos (Cedula, Nombre, Direccion, Telefono y Fecha).
La tabla Productos, tiene 5 atributos (Codigo, Descripcion, Cantidad, Vunitario y Vtotal)
Las llaves primarias de ambos son Cedula y Codigo.
No he manejado JOIN porque no lo conozco y segun lo que vi en tutoriales necesitaria tener ambas tablas relacionadas para hacer eso.
En el submit tengo el boton "ENVIAR" y "Regresar" que seria a la pagina principal de mi web.
Me tocaria verificar entre ambas tablas cual seria la union entre los campos y aplicar el JOIN pero no se como seria aplicar el JOIN y que parte del codigo llegaria a reemplazar.

Gracias!

Buenas tardes a todos, hoy vengo a compartir y me puedan ayudar de un problema que se me esta presentando en un sistema CRUD de facturacion basico que estoy haciendo.

Utilizo php para enviar los datos y conectar con mysql, que es donde llegan en unas tablas y luego poder ser mostradas en una tabla html. Verificando mi mysql los registros llegan y no se repiten, pero cuando llegan dichos registros a mi tabla html si se repiten cada vez que ingreso un registro nuevo, quisiera saber porque pasa. Gracias

Este es el codigo del formulario donde se envian los datos:

Código (actionscript) [Seleccionar] Expandir

<form method="POST" action="datos.php">
<div class="container facturacion1">
<div class="row">
   <div class="col-12 factura">
     <h1>SISTEMA DE FACTURACION BASICO</h1><br>
   </div>
   
<div class="col-12 col-md-6 facturacion datos2">
   <label>Cedula:</label><br>
   <input type="text" name="cc" placeholder="Digite su cedula"><br>
   <label>Nombre:</label><br>
   <input type="text" name="name" placeholder="Digite su nombre"><br>
   <label>Telefono:</label><br>
   <input type="text" name="phone" placeholder="Digite su celular"><br>
   <label>Direccion:</label><br>
   <input type="text" name="direccion" placeholder="Digite su direccion"><br>
   <label>Fecha:</label><br>
   <input type="date" name="fecha" placeholder="Digite la fecha">
 </div><br><br>

   <div class="col-12 col-md-6 facturacion">
       <label>Codigo:</label><br>
       <input type="text" name="code" placeholder="Codigo del Producto"><br>
       <label>Descripcion:</label><br>
       <input type="text" name="descripcion" placeholder="Descripcion del Producto"><br>
       <label>Cantidad:</label><br>
       <input type="text" name="cantidad" placeholder="Cantidad"><br>
       <label>Valor Unitario:</label><br>
       <input type="text" name="vunitario" placeholder="Valor unitario del Producto">
   </div><br><br>
   <div class="col-12 facturacion botones1">
     <input type="submit" name="envia" value="Enviar"><a href="../../index.php"><input type="submit" name="regresar" value="Regresar"></a>
   </div>

</div>
</div>
</form>


Codigo donde recibe los datos

Código (php) [Seleccionar] Expandir

<?php 

include("conexion_factura.php");

$cedula       = $_POST['cc'];
$nombre       = $_POST['name'];
$telefono     = $_POST['phone'];
$direccion    = $_POST['direccion'];
$fecha        = $_POST['fecha'];
$codigo       = $_POST['code'];
$descripcion  = $_POST['descripcion'];
$cantidad     = $_POST['cantidad'];
$vUnitario    = $_POST['vunitario'];

/* VALIDAR SI LOS DATOS EXISTEN */
$verificar = "SELECT * FROM Clientes, Productos WHERE 
Nombre = '$nombre', 
Cedula = '$cedula', 
Telefono = '$telefono'
Direccion = '$direccion'
Fecha = '$fecha'
Codigo = '$codigo'
Descripcion = '$descripcion'
Cantidad = '$cantidad'
Vunitario = '$vUnitario'";
if(mysqli_num_rows($verificar) > 0) {
print 'Los datos ya existen';
} 
/* SI LOS DATOS NO EXISTEN SE INSERTA */
else {

$clientes = "INSERT INTO Clientes (Cedula, Nombre, Telefono, Direccion, Fecha) VALUES ('$cedula',            '$nombre',  '$telefono', '$direccion', '$fecha')";

$productos = "INSERT INTO Productos (Codigo, Descripcion, Cantidad, Vunitario) VALUES ('$codigo', '$descripcion', '$cantidad', '$vUnitario')";

$verificacion = mysqli_query($conectar, $clientes);

$verificacion2 = mysqli_query($conectar, $productos); 

if ($verificacion && $verificacion2) {
header("location: factura.php");
}
else {
header("location: index.php");
}

}

?>


Codigo de la tabla html donde llegan los datos procedentes de la tabla mysql la cual muestra doble registro

Código (php) [Seleccionar] Expandir

  <?php 
     include("conexion_factura.php");
     
     ?>

<div class="container">
 <div class="row">
   <div class="col-12">

 <table class="table table-dark">
 <thead>
   <tr>
     <th scope="col">Cedula</th>
     <th scope="col">Nombre</th>
     <th scope="col">Telefono</th>
     <th scope="col">Direccion</th>
     <th scope="col">Fecha</th>
     <th scope="col">Codigo</th>
     <th scope="col">Descripcion</th>
     <th scope="col">Cantidad</th>
     <th scope="col">Vunitario</th>
     <th scope="col">Vtotal</th>
   </tr>
 </thead>
 <tbody>
<?php
$consulta = "SELECT Cedula, Nombre, Telefono, Direccion, Fecha FROM Clientes";
$sql = mysqli_query($conectar, $consulta);
while ($mostrar = mysqli_fetch_array($sql)) {

$consulta2 = "SELECT Codigo, Descripcion, Cantidad, Vunitario, Vtotal FROM Productos";
$sql2 = mysqli_query($conectar, $consulta2);
  while ($mostrar2 = mysqli_fetch_array($sql2)) {
?>

<tr>
 <td><?php echo $mostrar['Cedula']?></td>
 <td><?php echo $mostrar['Nombre']?></td>
 <td><?php echo $mostrar['Telefono']?></td>
 <td><?php echo $mostrar['Direccion']?></td>
 <td><?php echo $mostrar['Fecha']?></td>
 <td><?php echo $mostrar2['Codigo']?></td>
 <td><?php echo $mostrar2['Descripcion']?></td>
 <td><?php echo $mostrar2['Cantidad']?></td>
 <td><?php echo $mostrar2['Vunitario']?></td>
 <td><?php echo $mostrar2['Vtotal']?></td>
</tr>

<?php 

 }
}
?>

 </tbody>
</table>
<button><a href="index.php">Regresar</a></button>
</div>
</div>
 </div>


Gracias, espero que me puedan colaborar

Listo, Gracias por la respuesta

Buenas noches, hoy vengo a comentarles un problema que me esta saliendo en mi sitio web.

Resulta que estoy haciendo una pagina web con HTML5, PHP, CSS y javascript de todo lo que he estado aprendiendo y le he hecho de todo un poco, al parecer no se que estoy haciendo mal y me aparecieron en la console de google unos warnings y no se que puede ser, aqui se los dejo.

Código [Seleccionar] Expandir

A cookie associated with a cross-site resource at http://google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
contacto.html:1 A cookie associated with a cross-site resource at https://google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
contacto.html:1 A cookie associated with a cross-site resource at http://www.google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
contacto.html:1 A cookie associated with a resource at http://google.com/ was set with `SameSite=None` but without `Secure`. A future release of Chrome will only deliver cookies marked `SameSite=None` if they are also marked `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5633521622188032.

Estos warnings me aparecieron justo en mi pagina de contacto.html.


Espero me puedan colaborar, gracias