Para este tutorial utilizaremos el conocimiento adquirido en el tutorial anterior http://prodev.cl/2009/01/como-agregar-filas-rows-tabla-dinamicamente-mediante-xajax/ .
Lo que haremos será guardar los datos necesarios en campos ocultos y luego rescatarlos desde xajax y enviarlos a una función en PHP que los guarde en una Base de Datos.
Para comenzar, debemos modificar el código anterior y agregar en campos ocultos los valores extraídos del formulario añadiendo al nombre el número de línea al que corresponde el detalle de la siguiente manera:
hdn(nombreCampo)_(numeroLinea)
por lo que nuestro código quedaría de la siguiente forma:
$id_campos = $cant_campos = $num_campos+1; $str_html_td1 = $txtNombre . ' <input type="hidden" id="hdnNombre_' . $id_campos . '" name="hdnNombre_' . $id_campos . '" value="' . $txtNombre . '"/>' ; $str_html_td2 = "$txtEdad" . ' <input type="hidden" id="hdnEdad_' . $id_campos . '" name="hdnEdad_' . $id_campos . '" value="' . $txtEdad . '"/>' ; $str_html_td3 = "$txtDireccion" . ' <input type="hidden" id="hdnDireccion_' . $id_campos . '" name="hdnDireccion_' . $id_campos . '" value="' . $txtDireccion . '"/>' ; $str_html_td4 = "$selSexo" . ' <input type="hidden" id="hdnSexo_' . $id_campos . '" name="hdnSexo_' . $id_campos . '" value="' . $selSexo . '"/>' ; $str_html_td5 = "$selEstCivil" . ' <input type="hidden" id="hdnEstCivil_' . $id_campos . '" name="hdnEstCivil_' . $id_campos . '" value="' . $selEstCivil . '"/>' ; $str_html_td6 = '<img src="images/delete.png" width="16" height="16" alt="Eliminar" onclick="if(confirm(\'Realmente desea eliminar este detalle?\')){xajax_eliminarFila('. $id_campos .', proyecto.cant_campos.value);}"/>';
Además debemos agregar un campo oculto que contenga el número de línea correspondiente y le damos el nombre hdnIdCampos[] esto hará que se cree un arreglo de inputs llamados “hdnIdCampos” los cuales accederemos desde PHP. Lo podemos agregar a la última línea.
$str_html_td6 = '<img src="images/delete.png" width="16" height="16" alt="Eliminar" onclick="if(confirm(\'Realmente desea eliminar este detalle?\')){xajax_eliminarFila('. $id_campos .', proyecto.cant_campos.value);}"/>'; $str_html_td6 .= ' <input type="hidden" id="hdnIdCampos_'. $id_campos .'" name="hdnIdCampos[]" value="'. $id_campos .'" />
Aquí podemos ver el HTML generado dinámicamente por nuestra aplicación.
<table id="tblDetalle" class="listado" width="100%"> <tbody id="tbDetalle"> <tr id="rowDetalle_0"> <th id="tdDetalle_01">Nombre</th> <th id="tdDetalle_02">Edad</th> <th id="tdDetalle_03">Direccion</th> <th id="tdDetalle_04">Sexo</th> <th id="tdDetalle_05">Estado Civil</th> <th id="tdDetalle_06">Eliminar</th> </tr> <tr id="rowDetalle_1"> <td id="tdDetalle_11">eall <input id="hdnNombre_1" name="hdnNombre_1" value="eall" type="hidden"></td> <td id="tdDetalle_12">25 <input id="hdnEdad_1" name="hdnEdad_1" value="25" type="hidden"></td> <td id="tdDetalle_13">mi casa <input id="hdnDireccion_1" name="hdnDireccion_1" value="mi casa" type="hidden"></td> <td id="tdDetalle_14">Hombre <input id="hdnSexo_1" name="hdnSexo_1" value="Hombre" type="hidden"></td> <td id="tdDetalle_15">Soltero <input id="hdnEstCivil_1" name="hdnEstCivil_1" value="Soltero" type="hidden"></td> <td id="tdDetalle_16"><img src="images/delete.png" alt="Eliminar" onclick="if(confirm('Realmente desea eliminar este detalle?')){xajax_eliminarFila(1, proyecto.cant_campos.value);}" height="16" width="16"> <input id="hdnIdCampos_1" name="hdnIdCampos[]" value="1" type="hidden"></td> </tr> </tbody> </table>
Lo que sigue es crea una función que tome los valores de cada una de las filas o rows agregados y los guarde en la Base de Datos. Para esto aprovecharemos la bondad de PHP que nos permite tener arreglos con índices de tipo string y, construiremos los índices tomando el nombre del campo más el número de línea que guardamos en “hdnIdCampos”.
function guardar($formulario){ //comentaré todo lo que tenga que ver con la Base de Datos $flag = 0; extract($formulario); $respuesta = new xajaxResponse(); // $conn = new conexionBD ( ); //Genera una nueva coneccion // $conn->EjecutarSQL("BEGIN TRANSACTION A1"); foreach($hdnIdCampos as $id){ // Así recorro cada campo en cada linea // Guardo la consulta en una cadena $Str_SQL = "INSERT INTO PERSONAS( NOMBRE, EDAD, DIRECCION, SEXO, ESTCIVIL) VALUES( " . $formulario['hdnNombre_' . $id] . ", " . $formulario['hdnEdad_' . $id] . ", " . $formulario['hdnDireccion_' . $id] . ", " . $formulario['hdnSexo_' . $id] . ", ". $formulario['hdnEstCivil_' . $id] . ")"; // if(!$conn->EjecutarSQL($Str_SQL)){ //CONTROL DE ERRORES. muy importante, si no guarda uno, no guarda nada. // $conn->EjecutarSQL("ROLLBACK TRANSACTION A1"); // $flag = 1; // $MSG = "Ha ocurrido un error al insertar los datos de la persona.\nPor favor, intentelo nuevamente."; // } $respuesta->addAlert($Str_SQL); } if($flag == 0){ // $conn->EjecutarSQL("COMMIT TRANSACTION A1"); $MSG = "Datos guardados con exito"; } $respuesta->addAlert($MSG); return $respuesta; }
Si bien puede que no sea la mejor forma de realizarlo pero es lo mejor que se me ocurrió y lo más importante es que funciona.
Espero que les sirva.
Disfrútenlo y cualquier duda o comentario no teman en escribir.
Éxito.
Este ejemplo lo puedes ver en el siguiente enlace:
| ejemplo funcionando de Guardar en Base de Datos las Filas agregadas con xajax y PHP |
Tambien puedes decargar estos ejemplos:
| archivos de Guardar en Base de Datos las Filas agregadas con xajax y PHP | |
| Si te gustó o te sirvió, ya sabes que hacer |
|
11 de Marzo, 2009 - 2:29
Muuuchas Gracias….!
Tan perdido no andaba!!!!!