1

Estoy intentando validar un formulario que cuenta con inputs (tipo radio) que se repiten a través de un ciclo while mientras se encuentren datos en la db.

No logro como validar estos formularios dinámicos mediante jQuery ya que si lo dejo que valide solamente los input que estén chequeados; cuando elija cualquier input ya cumpliría con la condición, pero necesito validar varios input que se encuentran dentro de un formulario distinto.

¿Cómo podría validar que cuando no este seleccionado alguna opcion de alguno de los formularios me diga que faltan opciones por seleccionar?

Acá esta el código:.

PHP

$contacform = 0;

while ($row = mysql_fetch_array($resultados)) {

    echo '<div class="con">';
        echo '<p id="p">'.$contacform.'</p>';
    echo '</div>';

    echo '<form id="myformid" data-form="'.$contacform.'"align="center">
        <h2><strong>'.utf8_encode($row['pregunta']).'</strong></h2>
        <br>
        <label>'.$row['opcion1'].'</label>
        <input type="radio" name="check" id="check" value="1" required />
        <input type="hidden" name="checkd" value="'.$row['id_pregunta'].'" checked/>
        <br>
        <label>'.$row['opcion2'].'</label>
        <input type="radio" name="check" id="check" value="2" required />
        <br>
        <label>'.$row['opcion3'].'</label>
        <input type="radio" name="check" id="check" value="3" required />
        <br>
        <label>'.$row['opcion4'].'</label>
        <input type="radio" name="check" id="check" value="4" required />
        <br>
    </form>';

    $contacform += 1; 
}

echo '<div class="text-center">';
echo '<br>';
echo '<button class="btn btn-primary text-center enviartest">Enviar</button>';
echo '</div>';

JavaScript

$('.enviartest').click(function(){
    var selected = [];
    var selectedid = [];
    var my = [];

    /* Recorro el contador que se encuentra  en la etiqueta p dentro del div  con class con */
    $('.con p').each(function(){
        // alert($(this).attr('id'));

        /* obtengo lo que tiene  el  texto  de la  etiqueta p */
        var o = $(this).text();

        my.push($(this).attr('data-form'));;

        var definit = $('#myformid'+o+'input[name=check]');

        /*intento validar que cuando  seleccione   el formulario  numero  tal   y este  chequeado  el input con name  check  que es array me  mande un mensaje*/
        if ($('#myformid '+o+'input[name=check]:checked').is(':checked')) {
            alert('hola soy un cero');
        }else{
            alert('elije algo');
            alert(o);
        }

    });

    /*los input  que tengan  name  check y esten  chequeados  checked*/
    $('input[name=check]:checked').each(function(){
        selected.push($(this).val());
    }); 

    /*los input  que tengan  name  check y esten  chequeados  checked*/
    $('input[name=checkd]').each(function(){
        selectedid.push($(this).val());
    });

});
6
  • 1
    Hola @Jacks, bienvenido a StackOverflow en Español. Por favor sé más explícito con tu duda, especifica qué quieres decir con validar y qué parametros son requeridos para un formulario sea válido.
    – gugadev
    Commented el 28 sept. 2016 a las 17:38
  • Recomendación: crea IDs únicos. El código que pones genera duplicidad de IDs lo que te puede traer problemas más adelante.
    – Alvaro Montoro
    Commented el 9 abr. 2017 a las 12:56
  • @AlvaroMontoro colocando "form[]" los podría recorrer y recociendo los hijos que tiene ese form puede validar si hay campos vacíos. Que recorra todos (con un for) y coloque un boolean que cambie el estado del mismo cuando haga falta un campo. Si quiere obtener cual campo en especifico es un poco mas complicado el proceso.
    – bypabloc_
    Commented el 9 abr. 2017 a las 17:59
  • @PabloContreras no dije que quitar los IDs solucionara el problema. Dije que era una recomendación porque podría traerle problemas más adelante. Tener IDs duplicados es mala práctica y mal código.
    – Alvaro Montoro
    Commented el 9 abr. 2017 a las 18:12
  • @AlvaroMontoro bueno, no me explique bien. No estoy contradiciendo el comentario tuyo, solo estoy sugiriendo algo y te etiquete a ti a ver si parece buena practica? así lo hago yo en mi sistema para validar los form dinámicos.
    – bypabloc_
    Commented el 9 abr. 2017 a las 18:15

2 respuestas 2

1

Codigo PHP mandas la variable $contactform al id del formulario para distinguirlo: myformid0, myformid1, myformid2... myformidn

$contacform = 0;

while ($row = mysql_fetch_array($resultados)) {

echo '<div class="con">';
    echo '<p id="p">'.$contacform.'</p>';
echo '</div>';

echo '<form id="myformid'.$contacform.'" data-form="'.$contacform.'"align="center">
    <h2><strong>'.utf8_encode($row['pregunta']).'</strong></h2>
    <br>
    <label>'.$row['opcion1'].'</label>
    <input type="radio" name="check" id="check" value="1" required />
    <input type="hidden" name="checkd" value="'.$row['id_pregunta'].'" checked/>
    <br>
    <label>'.$row['opcion2'].'</label>
    <input type="radio" name="check" id="check" value="2" required />
    <br>
    <label>'.$row['opcion3'].'</label>
    <input type="radio" name="check" id="check" value="3" required />
    <br>
    <label>'.$row['opcion4'].'</label>
    <input type="radio" name="check" id="check" value="4" required />
    <br>
</form>';

$contacform++; 
}

echo '<div class="text-center">';
echo '<br>';
echo '<button class="btn btn-primary text-center 
enviartest">Enviar</button>';
echo '</div>';

Codigo JS

$('.enviartest').click(function(){
var selected = [];
var selectedid = [];
var my = [];

/* Recorro el contador que se encuentra  en la etiqueta p dentro del div  con class con */
$('.con p').each(function(index, value){
    // alert($(this).attr('id'));

    var o = $(this).text();

    my.push($(this).attr('data-form'));;
    //colocas el index al id del form
    var definit = $('#myformid'+index+' '+o+'input[name=check]');


    if ($('#myformid '+index+' '+o+'input[name=check]:checked').is(':checked')) {
        alert('hola soy un cero');
    }else{
        alert('elije algo');
        alert(o);
    }

});

/*los input  que tengan  name  check y esten  chequeados  checked*/
$('input[name=check]:checked').each(function(){
    selected.push($(this).val());
}); 

/*los input  que tengan  name  check y esten  chequeados  checked*/
$('input[name=checkd]').each(function(){
    selectedid.push($(this).val());
});

});
0

Necesitas agregarle un numero de identificación al formulario, en cada ciclo que generes uno nuevo, de esta manera los podrás accesar a través de jQuery haciendo referencia por su id, getElementByID('form1'), getElementByID('form2'), getElementByID('form3')

Cuando generes el formulario, guarda el numero de formularios que generaste, y así podrás obtener en jquery el n-esimo formulario.

Saludos

1
  • A ver @sibok666 no entiendo mucho yo hago eso desde el php es decir hago un contador y le asigno un numero dependiendo de cada form tal cual ahora en java script haría algo como esto ? ' var elec =[]; $('.con p').each(function(){ elec.push($(this).text());; });' for (var i = 0; elec.length < 0 ; i++) { alert(elec[i]); } ?
    – Jacks
    Commented el 3 oct. 2016 a las 16:01

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.