ayuda con formulario maestro detalle.

Iniciado por black47, Julio 04, 2017, 11:59:06 AM

Tema anterior - Siguiente tema

0 Miembros y 1 Visitante están viendo este tema.

Julio 04, 2017, 11:59:06 AM Ultima modificación: Julio 04, 2017, 08:28:28 PM por xyz
buenos dias, solicito de su ayuda ya que estoy tratando de realizar un formulario kardex de alumnos el cual pues guarda los datos personales del alumno pero aparte de eso debe guardar los años que curso y si los aprobo, campos: grado, año, libro, aprobo.

realice el siguiente formulario:
Código: php
<div class="row">
  <form class="form-horizontal"  method="POST" action="estudiantes/prueba.php">
<div class='form-group'>
<h3 class='col-sm-offset-2 col-sm-8 text-center'>Formulario de Registro de Estudiantes</h3>
</div>
<div class='form-group'>
<label for='nombre_estudiante' class='col-sm-2 control-label'>Nombre</label>
<div class='col-sm-8'><input id='nombre_estudiante' name='nombre_estudiante' type='text' class='form-control'  autofocus required></div>
</div>
<div class='form-group'>
<label for='apellido' class='col-sm-2 control-label'>Apellido</label>
<div class='col-sm-8'><input id='apellido' name='apellido' type='text' class='form-control'  autofocus required></div>
</div>
<div class='form-group'>
<label for='identificacion' class='col-sm-2 control-label'>Identificacion</label>
<div class='col-sm-8'><input id='identificacion' name='identificacion' type='text' class='form-control'  autofocus required></div>
</div>
<!--funciones-->
<div class="form-group row">
          <label for="grado" class="col-md-1 control-label">Grado: </label>
          <div class="col-md-1">
            <input type="text" class="form-control input-sm" id="txtGrado[]" placeholder="Ingrese El Año Cursado" >
             </div>
          <label for="año" class="col-md-1 control-label">Año</label>
              <div class="col-md-1">
                <input type="text" class="form-control input-sm" id="txtfecha[]" placeholder="Ingrese el año Cursado" >
              </div>
          <label for="libro" class="col-md-1 control-label">Libro</label>
              <div class="col-md-2">
                <input type="text" class="form-control" id="txtLibro[]" placeholder="Ingrese el Libro" >
              </div>
              <label for="exampleSelect1" class="col-md-1 control-label">Aprobo</label>
                <div class="col-md-2">
                <select class="form-control" id="txtAprobo[]">
                 <option>Si</option>
                 <option>NO</option>   
               </select>
               </div>           
              <div class="bloque">
                <input value="Agregar" type="button" onclick="Agrega()" />
            </div>
         </div>
<div class="col-md-6 col-md-offset-3">
<div id="tabla">
     
        <div>
            <table  id="tablaProductos" class="table table-striped">
                <tr>
                    <th scope="row">Grado</th>
                    <th>Año</th>
                    <th>Libro</th>
                    <th>Aprobo</th>
                    <th>X</th>
                </tr>
            </table>
        </div>
</div>
</div>
<!--fin funciones-->
<div class='form-group'>
<div class='col-sm-offset-2 col-sm-8'>
<input id='' type='submit' class='btn btn-primary' name="insertar" value='Guardar'>
<input id='btn_listar' type='button' class='btn btn-primary' value='Listar'>
</div>
</div>
      </form>
  </div>



y para crear el formulario maestro ejecuto el codigo:

<script>
  function Agrega(){

    //obtenemos los valores de nuestra caja de texto
    var grado=document.getElementById("txtGrado[]").value;
    var fecha=document.getElementById("txtfecha[]").value;
    var libro=document.getElementById("txtLibro[]").value;
    var aprobo=document.getElementById("txtAprobo[]").value;

    //creamos un objeto tr que anexaremos a nuestra tabla llamada tableProductos
    var TR= document.createElement("tr");

    //creamos 4 elementos td en donde iran los datos y uno cuarto donde ira un boton para eliminar
    var TD1=document.createElement("td")
    var TD2=document.createElement("td")
    var TD3=document.createElement("td")
    var TD4= document.createElement("td");
    var TD5= document.createElement("td")

    //asignamos los valores a nuestros td por medio del atributo innerHTML, el cual tiene el contenido HTML de un Nodo
    TD1.innerHTML=grado;
    TD2.innerHTML=fecha;
    TD3.innerHTML=libro;
    TD4.innerHTML=aprobo;

    //A continuación asignamos contenido html a nuestro cuarto td
    //esta es una forma de crear elementos tambien, dando el codigo html a un Nodo
    TD5.innerHTML="<input type='button' value='Eliminar' onclick='Elimina(this)'>"

    //Ahora proseguimos a agregar los hijos TD al Padre TR
    //Esta es otra manera de crear elementos HTML, por medio de el metodo appendChild
    TR.appendChild(TD1);
    TR.appendChild(TD2);
    TR.appendChild(TD3);
    TR.appendChild(TD4);
    TR.appendChild(TD5);

    //Por ultimo asignamos nuestro TR a la tabla con id tablaProductos
    document.getElementById("tablaProductos").appendChild(TR)

    //limpiamos nuestros inputs para agregar ma datos, y ponemos el foco nuevamente en el input de codigo
    document.getElementById("txtGrado[]").value=""
    document.getElementById("txtfecha[]").value="";
    document.getElementById("txtLibro[]").value="";
    document.getElementById("txtAprobo[]").value="";
    document.getElementById("txtGrado[]").focus();
}

function Elimina(NodoBoton){

    //recibimos el boton como parametro, obtendremos el tr que lo contiene de la siguiente manera
    //Como nuestro boton es hijo de un td, y este td de el tr, debemos invocar dos veces parentNode
    //Esto para llegar a tener el TR
    var TR= NodoBoton.parentNode.parentNode;

    //ahora que ya tenemos el padre TR, podemos eliminarlo de la siguiente manera
    //junto a todos sus hijos

    document.getElementById("tablaProductos").removeChild(TR);
}
</script>

mi problema es que no e logrado que envie los arrays (txtGrado[]), conjunto con los campos del estudiante, ya que los datos personales del estudiante se insertan en una tabla llamada estudiante, y los datos del array[] los debo guardar en una tabla llamada detalle_estudiante,  ya que a estas dos tablas les hice una relacion por ID_estudiante.

problemas:

1: estoy confundido si al generar el formulario detalle maestro esta generando un array.
2: cuando guarde el detalle como le digo q ese detalle pertenece al id del estudiante?
3: como envio ese array a la bd.

ayudemen estoy completamente perdido :(


Julio 04, 2017, 12:03:48 PM #1 Ultima modificación: Julio 04, 2017, 12:07:11 PM por dannybombastic
No tienes permitido ver enlaces. Registrate o Entra a tu cuenta
buenos dias, solicito de su ayuda ya que estoy tratando de realizar un formulario kardex de alumnos el cual pues guarda los datos personales del alumno pero aparte de eso debe guardar los años que curso y si los aprobo, campos: grado, año, libro, aprobo.

realice el siguiente formulario:
<div class="row">
  <form class="form-horizontal"  method="POST" action="estudiantes/prueba.php">
<div class='form-group'>
<h3 class='col-sm-offset-2 col-sm-8 text-center'>Formulario de Registro de Estudiantes</h3>
</div>
<div class='form-group'>
<label for='nombre_estudiante' class='col-sm-2 control-label'>Nombre</label>
<div class='col-sm-8'><input id='nombre_estudiante' name='nombre_estudiante' type='text' class='form-control'  autofocus required></div>
</div>
<div class='form-group'>
<label for='apellido' class='col-sm-2 control-label'>Apellido</label>
<div class='col-sm-8'><input id='apellido' name='apellido' type='text' class='form-control'  autofocus required></div>
</div>
<div class='form-group'>
<label for='identificacion' class='col-sm-2 control-label'>Identificacion</label>
<div class='col-sm-8'><input id='identificacion' name='identificacion' type='text' class='form-control'  autofocus required></div>
</div>
<!--funciones-->
<div class="form-group row">
          <label for="grado" class="col-md-1 control-label">Grado: </label>
          <div class="col-md-1">
            <input type="text" class="form-control input-sm" id="txtGrado[]" placeholder="Ingrese El Año Cursado" >
             </div>
          <label for="año" class="col-md-1 control-label">Año</label>
              <div class="col-md-1">
                <input type="text" class="form-control input-sm" id="txtfecha[]" placeholder="Ingrese el año Cursado" >
              </div>
          <label for="libro" class="col-md-1 control-label">Libro</label>
              <div class="col-md-2">
                <input type="text" class="form-control" id="txtLibro[]" placeholder="Ingrese el Libro" >
              </div>
              <label for="exampleSelect1" class="col-md-1 control-label">Aprobo</label>
                <div class="col-md-2">
                <select class="form-control" id="txtAprobo[]">
                 <option>Si</option>
                 <option>NO</option>   
               </select>
               </div>           
              <div class="bloque">
                <input value="Agregar" type="button" onclick="Agrega()" />
            </div>
         </div>
<div class="col-md-6 col-md-offset-3">
<div id="tabla">
     
        <div>
            <table  id="tablaProductos" class="table table-striped">
                <tr>
                    <th scope="row">Grado</th>
                    <th>Año</th>
                    <th>Libro</th>
                    <th>Aprobo</th>
                    <th>X</th>
                </tr>
            </table>
        </div>
</div>
</div>
<!--fin funciones-->
<div class='form-group'>
<div class='col-sm-offset-2 col-sm-8'>
<input id='' type='submit' class='btn btn-primary' name="insertar" value='Guardar'>
<input id='btn_listar' type='button' class='btn btn-primary' value='Listar'>
</div>
</div>
      </form>
  </div>



y para crear el formulario maestro ejecuto el codigo:

<script>
  function Agrega(){

    //obtenemos los valores de nuestra caja de texto
    var grado=document.getElementById("txtGrado[]").value;
    var fecha=document.getElementById("txtfecha[]").value;
    var libro=document.getElementById("txtLibro[]").value;
    var aprobo=document.getElementById("txtAprobo[]").value;

    //creamos un objeto tr que anexaremos a nuestra tabla llamada tableProductos
    var TR= document.createElement("tr");

    //creamos 4 elementos td en donde iran los datos y uno cuarto donde ira un boton para eliminar
    var TD1=document.createElement("td")
    var TD2=document.createElement("td")
    var TD3=document.createElement("td")
    var TD4= document.createElement("td");
    var TD5= document.createElement("td")

    //asignamos los valores a nuestros td por medio del atributo innerHTML, el cual tiene el contenido HTML de un Nodo
    TD1.innerHTML=grado;
    TD2.innerHTML=fecha;
    TD3.innerHTML=libro;
    TD4.innerHTML=aprobo;

    //A continuación asignamos contenido html a nuestro cuarto td
    //esta es una forma de crear elementos tambien, dando el codigo html a un Nodo
    TD5.innerHTML="<input type='button' value='Eliminar' onclick='Elimina(this)'>"

    //Ahora proseguimos a agregar los hijos TD al Padre TR
    //Esta es otra manera de crear elementos HTML, por medio de el metodo appendChild
    TR.appendChild(TD1);
    TR.appendChild(TD2);
    TR.appendChild(TD3);
    TR.appendChild(TD4);
    TR.appendChild(TD5);

    //Por ultimo asignamos nuestro TR a la tabla con id tablaProductos
    document.getElementById("tablaProductos").appendChild(TR)

    //limpiamos nuestros inputs para agregar ma datos, y ponemos el foco nuevamente en el input de codigo
    document.getElementById("txtGrado[]").value=""
    document.getElementById("txtfecha[]").value="";
    document.getElementById("txtLibro[]").value="";
    document.getElementById("txtAprobo[]").value="";
    document.getElementById("txtGrado[]").focus();
}

function Elimina(NodoBoton){

    //recibimos el boton como parametro, obtendremos el tr que lo contiene de la siguiente manera
    //Como nuestro boton es hijo de un td, y este td de el tr, debemos invocar dos veces parentNode
    //Esto para llegar a tener el TR
    var TR= NodoBoton.parentNode.parentNode;

    //ahora que ya tenemos el padre TR, podemos eliminarlo de la siguiente manera
    //junto a todos sus hijos

    document.getElementById("tablaProductos").removeChild(TR);
}
</script>

mi problema es que no e logrado que envie los arrays (txtGrado[]), conjunto con los campos del estudiante, ya que los datos personales del estudiante se insertan en una tabla llamada estudiante, y los datos del array[] los debo guardar en una tabla llamada detalle_estudiante,  ya que a estas dos tablas les hice una relacion por ID_estudiante.

problemas:

1: estoy confundido si al generar el formulario detalle maestro esta generando un array.
2: cuando guarde el detalle como le digo q ese detalle pertenece al id del estudiante?
3: como envio ese array a la bd.

ayudemen estoy completamente perdido :(
No pude leer todo pero el array pasalo a json y despues en la bd lo guardas iterando uno por uno si tienes un modelo para el formulario mejor pero si no haz un objeto json con todos esos atributos.

Al rato lo leo mejor y te echo un cable a no ser que halla alguien mas . Por lo del id no hay magia o lo traes como bundel de otro sitio o parametros o tendras que hacer una peticion si tienes el nombre del registro qur te devuelva el id no?

    Lo unico que entendi del post fueron las preguntas 2 y 3, para solucionar la 2 podrias crear los td con un identifador, en este caso el primario podria ser
    la identificacion del estudiante, luego creas los TD con id estudiante_+IDFENTIFICACION
    luego cuando quieras grabar los recorres con un array;
   
   
Código: javascript
var array = new Array();
$('[id^=estudiante_]').each(function () {

        var objProducto = new Object();

        objProducto.idestudiante = $(this).attr('id');

        objProducto.txtidantf = $("#txtnombreestudiante_" + objProducto.idestudiante).val();

        array.push(objProducto);
    });

   
    y luego ya pasas el array a php, lo recorres y guardas en la DB, eso,
           
            Saludos!