1

Necesito saber cómo obtener los datos ingresados con método POST o GET luego de mostrar y ocultar los inputs . Tengo un código que solo muestra y oculta inputs con botones, pero no envia todos los datos de todos los inputs con método POST.

Este es mi código:

 var ctr = 0;
        var ctr_bdra = 0;
        var init = 0;
        var contenedor = $(".inputs");
        var edad = $(".edad_hidden");
        var edades;

        $(".agregar").click(function(e){            
            add_control(contenedor);
            $(".agregar, .nth").hide(); 
            e.preventDefault();
        });


        $(document).on('click', 'button.agregar_in', function(e){
            if($(".ed").val() == "")
            {
                return false;

            }else{
                add_control(contenedor);
                ctr_bdra = 1;
                if(ctr_bdra > 0){
                    $(this).hide();
                    
                    $(this).next().hide();
                }

            }
            e.preventDefault();

        });

        $(document).on('click', 'button.eliminar_in', function(e){ 
            array = $(".edad_hidden").val().split(',');
            array.pop();
            $(".edad_hidden").val(array);
            var node = $(this).parent();
            node.remove();
            if(!$(".btun").is(":visible")){
                $(".agregar, .nth").show();
            }           
            $('button.agregar_in').last().show();
            
            $('button.eliminar_in').last().show();
            e.preventDefault();
        });

        $(document).on('keyup','.ed', function() {
            var info = [];
            $('.ed').each(function(){ info.push($(this).val()); });
            $(".edad_hidden").val(info);
        });


        function add_control(contenedor){
            ctr = ctr + 1;
            contenedor.append('<div class="btun"><input type="number" min="0" class="ed" name="edades" value=""  id="tb' + ctr + '' +'"/>'+
                              '<button class="agregar_in">+</button>'+
                              '<button class="eliminar_in">-</button></div>');
        }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post" >
      <p class="nth" style="display: inline-block;">Agregar</p>
      <button class="agregar">+</button>
      <div class="inputs"></div>
      <input type="hidden" value  class="edad_hidden"></input>   
      <input type="submit" value="enviar" />
    </form>
    
    <?php
$envio=$_POST['edades'];
    echo $envio;
?>

1 respuesta 1

2

Cuando hacés .append() de la función add_control() en vez de ponerle de nombre al input como name="edades", lo reemplazaría por name="edades[]" para que tome el valor como un array por cada input que ingresas. Debería quedar así:

function add_control(contenedor) {
  ctr = ctr + 1;
  contenedor.append(
    '<div class="btun"><input type="number" min="0" class="ed" name="edades[]" value=""  id="tb' +
      ctr +
      "" +
      '"/>' +
      '<button class="agregar_in">+</button>' +
      '<button class="eliminar_in">-</button></div>'
  );
}

Luego en el PHP vas a recibir algo como lo siguiente:

var_dump($_POST['edades']);

Esto imprime un array.


 var ctr = 0;
        var ctr_bdra = 0;
        var init = 0;
        var contenedor = $(".inputs");
        var edad = $(".edad_hidden");
        var edades;

        $(".agregar").click(function(e){            
            add_control(contenedor);
            $(".agregar, .nth").hide(); 
            e.preventDefault();

        });


        $(document).on('click', 'button.agregar_in', function(e){
            if($(".ed").val() == "")
            {
                return false;

            }else{
                add_control(contenedor);
                ctr_bdra = 1;
                if(ctr_bdra > 0){
                    $(this).hide();
                    
                    $(this).next().hide();
                }

            }
            e.preventDefault();

        });

        $(document).on('click', 'button.eliminar_in', function(e){ 
            array = $(".edad_hidden").val().split(',');
            array.pop();
            $(".edad_hidden").val(array);
            var node = $(this).parent();
            node.remove();
            if(!$(".btun").is(":visible")){
                $(".agregar, .nth").show();
            }           
            $('button.agregar_in').last().show();
            
            $('button.eliminar_in').last().show();
            e.preventDefault();
        });

        $(document).on('keyup','.ed', function() {
            var info = [];
            $('.ed').each(function(){ info.push($(this).val()); });
            $(".edad_hidden").val(info);
        });


        function add_control(contenedor){
            ctr = ctr + 1;
            contenedor.append('<div class="btun"><input type="number" min="0" class="ed" name="edades[]" value=""  id="tb' + ctr + '' +'"/>'+
                              '<button class="agregar_in">+</button>'+
                              '<button class="eliminar_in">-</button></div>');
        }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post">
  <p class="nth" style="display: inline-block;">Agregar</p>
  <button class="agregar">+</button>
  <div class="inputs"></div>
  <input type="hidden" value class="edad_hidden" />
  <input type="submit" value="enviar" />
</form>

5
  • muchas gracias mano , lo probaré a ver que sucede
    – Richard
    Commented el 20 may. 2018 a las 17:06
  • man una consulta , ahora como hago para grabar estos numeros en un solo campo en base de datos php con mysql.
    – Richard
    Commented el 20 may. 2018 a las 17:21
  • Eso es otra pregunta pero podés hacer un implode() del array como $edades = implode(',', $_POST['edades']);. Entonces eso te genera un string y ya podés insertarlo en la DB sin problemas.
    – Kleith
    Commented el 20 may. 2018 a las 17:24
  • ok , excelente. ahroa he colgado otra pregunta parecido , en vez de los input aparezcan los slider de JQuery UI
    – Richard
    Commented el 20 may. 2018 a las 18:54
  • es.stackoverflow.com/questions/166097/…
    – Richard
    Commented el 20 may. 2018 a las 18:56

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.