Comunidad de diseño web y desarrollo en internet online

guardar filas dinamicas de tabla jquery PHP

Foros de discusión > Javascript y jQuery

Citar            
MensajeEscrito el 17 May 2013 11:33 pm
Hola soy nueva por aquí.. mi problema es el siguiente:
tengo una tabla que hace agrega filas dinamicas
que agrego por medio de un boton con esta funcion que se va guardando dentro de un arreglo..

Código Javascript :

$('.clsGuardar').live('click',function(){
    var $objCuerpoTabla=$("#tabla1").children().prev().parent();
         $objCuerpoTabla.find('tbody tr').each(function(){
              var objDatosColumna=Array();
             $(this).find('td').each(function(iColumna){
                if(iColumna<6){ 
                 objDatosColumna.push($(this).find('input[type="text"]').val());
                }
            });
                 });
    });


Lo que quiero es enviar ese arreglo a mi servidor para poder guardar la informacion en MYSQL,y lo he intentado asi:

Código Javascript :

jQuery.ajax({
        url:'11.php',
        type:'post',
        
    data:{
         dato:'objDatoscolumna',
    }
    }).done(
        function(resp)
        {
            alert(resp);
        }
    );


Pero no consigo que la informacion se envie, alguien que pudiera decirme como poder enviar el array... se lo agradeceria mucho, ya que le he dado muchas vueltas y nada...

Por causs

9 de clabLevel



 

Envíale un mensaje privado    

chrome
Citar            
MensajeEscrito el 17 May 2013 11:41 pm
No necesitas recorrer "a mano" los inputs. Ya que estás usando JQuery, simplemente puedes usar el método .serialize().

Suponiendo que el formulario (tag <form>) tiene el id="miformulario":

Código Javascript :

jQuery.ajax({
        url:'11.php',
        type:'post',
        
    data:{
         dato:$("#miformulario").serialize(),
    }
    }).done(
        function(resp)
        {
            alert(resp);
        }
    );

Y eso es todo.

Por DriverOp

Claber

2510 de clabLevel



 

Envíale un mensaje privado     Web

opera
Citar            
MensajeEscrito el 17 May 2013 11:56 pm
Muchas gracias por responder, pero abusando de tu buena voluntad hice el cambio como dijiste, pero en vez del form, puse el id de la tabla, lo que pasa es que tengo un form, que tiene 3 tablas diferentes, entonces en cada una quiero guardar un array, porque van a diferentes tablas.. el cambio lo he puesto asi:

Código :

[js]jQuery.ajax({
        url:'11.php',
        type:'post',
      
   data:{
         dato:$("#divContenedorTabla2").serialize(),
    }
    }).done(
        function(resp)
        {
            alert(resp);
        }
    );

             });
         
       
});[/js]

Pero ahora al recibirlo en la pagina de PHP

Código :

[php]<?php
foreach($_POST['dato'] as $dato)
{
echo " $dato <br/>\n";
}
?>[/php]


me manda el error de que los argumentos no son validos... Alguna sugerencia de que estoy haciendo mal??.. Gracias..

Por causs

9 de clabLevel



 

Envíale un mensaje privado    

chrome
Citar            
MensajeEscrito el 18 May 2013 02:22 pm
El método .serialize() solo funciona con <form>. Lo que deberías hacer, si no entendí mal tu problema, es encerrar cada <table> con un <form> diferente y enviarlos por separado.

Por DriverOp

Claber

2510 de clabLevel



 

Envíale un mensaje privado     Web

opera
Citar            
MensajeEscrito el 21 May 2013 06:22 pm
hola muchas gracias por tu respuesta.. cada tabla la puse en un form..
ya pude serializar los datos asi:

Código Javascript :

$('.clsGuardar2').live('click',function(){
        var inputs =$('#form1').serialize();
      var inputs2 =$('#form2').serialize();
        var inputs3 =$('#form3').serialize();
       $.ajax({
      type:'POST',
      url:'11.php',
       data:inputs+inputs2+inputs3 ,
      success: function(resp){
      alert(inputs3);
      alert(resp);
      return false;
       }
        });

             });

Pero ahora como puedo recbir los datos fila por fila en PHP??
para los datos que tengo por asi decir sueltos los recibo asi

Código PHP :

<?php  
$ins = $_POST['ins'];
$fins = $_POST['fins'];
$sec = $_POST['sec'];

?>

pero para los serializados?? Muchas gracias por tu ayuda...

Por causs

9 de clabLevel



 

Envíale un mensaje privado    

chrome
Citar            
MensajeEscrito el 22 May 2013 12:44 pm
En PHP haz esto:

Código PHP :

echo "<pre>";
print_r($_POST);
echo "</pre>";

Esto te mostrará exactamente qué te llega por POST y así sabrás cómo manipular los datos.

Por DriverOp

Claber

2510 de clabLevel



 

Envíale un mensaje privado     Web

opera
Citar            
MensajeEscrito el 22 May 2013 03:58 pm
Hola..
Muchas gracias, ya puedo recibir el arreglo en PHP como me dijiste.. pero mi problema ahora es que mi tabla tiene varias filas, entonces solo me envia la ultima fila de la tabla y no todo, como puedo recibir todo el arreglo completo??.. se me ocurre que con un FOR pero no se como recorrer la tabla completa..
Y disculpa por mi preguntas de novata..

Por causs

9 de clabLevel



 

Envíale un mensaje privado    

chrome
Citar            
MensajeEscrito el 22 May 2013 05:57 pm
Hasta acá puedo llegar. No tengo idea de cómo has hecho la página en cuestión y por tanto me es imposible responderte.

Pon la URL de la página que estás haciendo.

Por DriverOp

Claber

2510 de clabLevel



 

Envíale un mensaje privado     Web

opera
Citar            
MensajeEscrito el 22 May 2013 06:30 pm
Hola
Por desgracia no lo tengo en linea..
Pero te explico desde el principio, tengo una tabla a donde se le van agregando filas dinamicamente con un boton

Código HTML :

  <form id="form3">
 
   <table  id="tabla2" name="tabla2"align="center" width="450">
            <caption>
            Datos 
            </caption>
            <thead>
               <tr>
                  <th>TIPO</th>
                  <th>NOMBRE</th>
                  <th>APELLIDO PATERNO</th>
                  <th>APELLIDO MATERNO</th>
                  <th width="22"><input type="button" value="+" class="clsAgregarFila2"></th>
               </tr>
            </thead>
            <tbody>
               <tr>
                  <td> <select name="tipo" id="tipo" class="compa"><option value="ad">ADQUIRIENTE</option><option value="ena">ENAJENANTE</option></select></td>
                  <td><input type="text" id="nom" name="nom"  class="compa"></td>
                  <td><input type="text" id="ap" name="ap"  class="compa"></td>
                  <td><input type="text" id="am" name="am"  class="compa"></td>
                  <td><input type="button" value="--" class="clsEliminarFila" /></td>
                  <td align="right">&nbsp;</td>
               </tr>
            </tbody>
            <tfoot>
               <tr>
                 <td colspan="8" align="right">&nbsp;</td>
               </tr>
            </tfoot>
   </table>    </form>
          <div align="center">
            <input type="button" value="Enviar" class="clsGuardar3" />
    </div>


Este es mi codigo del boton que va agregando las filas....

Código Javascript :

$(document).on('click','.clsAgregarFila2',function(){
         var strNueva_Fila='<tr>'+
'<td><select name="tipo" id="tipo" class="compa"><option value="ad">ADQUIRIENTE</option><option value="ena">ENAJENANTE</option></select></td>'+
         '<td><input type="text" id="nom" name="nom"  class="compa"></td>'+
         '<td><input type="text" id="ap" name="ap" " class="compa"></td>'+
         '<td><input type="text" id="am" name="am"  clas="compa"></td>'+
         '<td align="right"><input type="button" value="--" class="clsEliminarFila"></td>'+
      '</tr>';
   
         tbody una nueva fila*/
      var objTabla=$(this).parents().get(3);
            
      //agregamos la nueva fila a la tabla
      $(objTabla).find('tbody').append(strNueva_Fila);
      
                  
   });


y lo que quiero es que despues de agregar todas las filas que el usuario necesite, guardar toda esa informacion en la BD, eso lo he estado intentando con jquery.serialize, pero me manda solo la informacion de la primera fila, y no todas las filas que el usuario agrego

Código Javascript :

$('.clsGuardar3').live('click',function(){
          var data=$('#form3').serialize();
     
      $.ajax({
         type: "POST",
        dataType:"html",
        //async: false,
        url: "11.php",
      
        data: data,,
        success: function (data) {
            alert(data)
         
        }
    });

             });


entonces mi pregunta es esa como puedo recorrer todo el arreglo??? O como puedo enviar los datos de todas las filas a PHP...
Muchas gracias por tomarte la molestia de contestarme.... Saludos..

Por causs

9 de clabLevel



 

Envíale un mensaje privado    

chrome
Citar            
MensajeEscrito el 22 May 2013 08:20 pm
En cada atributo name de los <input> agrega paréntesis rectos. Por ejemplo:

Código HTML :

<input type="text" id="nom" name="nom[]"  class="compa">

Eso creará en el array $_POST un array con índice numérico y con el nombre "nom".

Por DriverOp

Claber

2510 de clabLevel



 

Envíale un mensaje privado     Web

opera
Citar            
MensajeEscrito el 24 May 2013 11:17 pm
hola.. muchas gracias por responder, al fin pude guardar el arreglo tal y como lo queria.. lo deje asi:

Código HTML :

<input type="text" id="nom" name="nom[0][nom]">


ahora tengo otro problema que cada vez que agrego una fila dinamica, dentro de los campos hay un combo dinamico, que lleno con datos de una BD, pero como puedo hacer que ese select aparezca igual cada vez que agrego la fila en JQUERY, osea con todos los datos que se cargaron con la consulta de MYSQL.. Oajala me haya explicado.. Gracias anticipadas...

Código PHP :

<td><select name="dir[0][pob]" id="pob"></select></td>
                <td>
                  <?php 
                  $zona=12;
                  $munb="select * from municipio where zona='$zona' ORDER BY nombrem asc";   
                  $remun=mysql_query($munb,$conexion) or die(mysql_error());
                  $fmun=mysql_num_rows($remun);
                  ?>   
                  <select name="dir[0][mun]" id="mun">
                  <?php   
                  while ($row = mysql_fetch_array($remun))
                   {
                     ?>
                  <OPTION VALUE="<?php echo $row['clave'] ?>"><?php echo $row['nombrem'] ?></OPTION>
                  <? }
                   ?>
                  </SELECT></td>

Por causs

9 de clabLevel



 

Envíale un mensaje privado    

chrome
Citar            
MensajeEscrito el 25 May 2013 02:25 pm
El tag <option> tiene un atributo "selected" para indicar que ese <option> es el que está seleccionado por omisión en el <select>.

Por DriverOp

Claber

2510 de clabLevel



 

Envíale un mensaje privado     Web

opera
Citar            
MensajeEscrito el 29 May 2013 05:49 am
Holaa

Gracias por la idea, he estado intentando haciendolo asi:

Código Javascript :

$('#pob option').clone().appendTo("#pob2");


Lo que necesito es que al agregar una fila nueva, el combo se llene con los mismos datos que en el primer combo, con el codigo anterior solo logro que se duplique en la segunda fila, pero si agrego otra ya no carga nada...

y con este codigo

Código Javascript :

var clonado = $("#pob").clone(true);
        clonado.appendTo("body");        
       


me lo duplica como yo quiero, pero en un select diferente.. como podria meter esa variable en el select para que asi cargue con esa informacion???? y no en otro???

Muchas graciass....

Por causs

9 de clabLevel



 

Envíale un mensaje privado    

chrome
Citar            
MensajeEscrito el 27 Sep 2013 08:58 pm

DriverOp escribió:

En cada atributo name de los <input> agrega paréntesis rectos. Por ejemplo:

Código HTML :

<input type="text" id="nom" name="nom[]"  class="compa">

Eso creará en el array $_POST un array con índice numérico y con el nombre "nom".


Quisiera saber como pudiste pasarel arreglo completo ya que al pasarlos no me llega.

Por zambrano.ivan

0 de clabLevel



 

Envíale un mensaje privado    

firefox
Citar            
MensajeEscrito el 01 Oct 2013 02:41 pm
Cabe destacar

Que .seralize() funciona con el atributo "name" por ello DriverOp recomienda generar un nombre en forma de arreglo.

name[]

Si sus input no tienen el atributo "name", la funcion serialize() no funciona del todo bien. de preferencia utilizen nombres para recuperar los valores.

Por elporfirio

Claber

652 de clabLevel

1 tutorial

Genero:Masculino  

Envíale un mensaje privado     Web

FullStack Web Developer

firefox
Citar            
MensajeEscrito el 05 Oct 2015 08:56 pm

causs escribió:

Hola soy nueva por aquí.. mi problema es el siguiente:
tengo una tabla que hace agrega filas dinamicas
que agrego por medio de un boton con esta funcion que se va guardando dentro de un arreglo..

Código Javascript :

$('.clsGuardar').live('click',function(){
    var $objCuerpoTabla=$("#tabla1").children().prev().parent();
         $objCuerpoTabla.find('tbody tr').each(function(){
              var objDatosColumna=Array();
             $(this).find('td').each(function(iColumna){
                if(iColumna<6){ 
                 objDatosColumna.push($(this).find('input[type="text"]').val());
                }
            });
                 });
    });


Lo que quiero es enviar ese arreglo a mi servidor para poder guardar la informacion en MYSQL,y lo he intentado asi:

Código Javascript :

jQuery.ajax({
        url:'11.php',
        type:'post',
        
    data:{
         dato:'objDatoscolumna',
    }
    }).done(
        function(resp)
        {
            alert(resp);
        }
    );


Pero no consigo que la informacion se envie, alguien que pudiera decirme como poder enviar el array... se lo agradeceria mucho, ya que le he dado muchas vueltas y nada...



Alguien me podria ayudar con un ejemplo en funcionamiento con el codigo para poder verlo como se lo hacer porque tengo un problema similar y no logro solucinarlo, ayuda por favor

Por AndresCondo

2 de clabLevel



Genero:Masculino  

Envíale un mensaje privado   Email  

firefox
Citar            
MensajeEscrito el 16 Oct 2015 08:35 am

AndresCondo escribió:

causs escribió:

Hola soy nueva por aquí.. mi problema es el siguiente:
tengo una tabla que hace agrega filas dinamicas
que agrego por medio de un boton con esta funcion que se va guardando dentro de un arreglo..

Código Javascript :

$('.clsGuardar').live('click',function(){
    var $objCuerpoTabla=$("#tabla1").children().prev().parent();
         $objCuerpoTabla.find('tbody tr').each(function(){
              var objDatosColumna=Array();
             $(this).find('td').each(function(iColumna){
                if(iColumna<6){ 
                 objDatosColumna.push($(this).find('input[type="text"]').val());
                }
            });
                 });
    });


Lo que quiero es enviar ese arreglo a mi servidor para poder guardar la informacion en MYSQL,y lo he intentado asi:

Código Javascript :

jQuery.ajax({
        url:'11.php',
        type:'post',
        
    data:{
         dato:'objDatoscolumna',
    }
    }).done(
        function(resp)
        {
            alert(resp);
        }
    );


Pero no consigo que la informacion se envie, alguien que pudiera decirme como poder enviar el array... se lo agradeceria mucho, ya que le he dado muchas vueltas y nada...



Alguien me podria ayudar con un ejemplo en funcionamiento con el codigo para poder verlo como se lo hacer porque tengo un problema similar y no logro solucinarlo, ayuda por favor


Mira en el post de aplicación para hacer facturas que tienes un enlace al código funcionando que hace lo mismo que este

Por Killpe

6 de clabLevel



 

Envíale un mensaje privado    

safari
Foros de discusión > Javascript y jQuery

   Página 1 de 1

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.