JavaScript - Validar distintos tipos de input

 
Vista:
Imágen de perfil de grimble
Val: 8
Ha aumentado 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

Validar distintos tipos de input

Publicado por grimble (3 intervenciones) el 17/02/2020 23:25:55
Buenas tardes a todos!

Hace unas cuantas horas que me encuentro trabado para avanzar en un proyecto simple.
Arme un formulario multi step donde el usuario tiene que completar estos 3 datos para avanzar al siguiente paso:
form

De cada fila solo se selecciona un radio y se completa el text.
Por el momento logre que antes de ir al siguiente paso valide los radio, pero no se me ocurre como hacer para validar, a su vez, los text.

Les dejo parte del codigo por si a alguno se le ocurre alguna manera mejor de hacerlo.

Gracias!
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
function validateForm() {
    // This function deals with validation of the form fields
    var x, y, minimo, sumo, seleccionado, i, valid = true;
    x = document.getElementsByClassName("tab");
    y = x[currentTab].getElementsByTagName("input");
 
 
    minimo = (y.length/4);
    sumo=0;
    seleccionado = false;
//El bucle chequea cada etiqueta input del div "tab" en pantalla:
            for (i = 0; i < y.length; i++) {
                // Si ningun radio fue seleccionado...
                if (y[i].checked == false){
                    // add an "invalid" class to the field:
                    y[i].className += " invalid";
                    // and set the current valid status to false:
                }else{
                    sumo++;
                        if (sumo>=minimo){ //si no supera el minimo de radio a seleccionar...
                            seleccionado=true;
                        }
                }
            }
 
  // Si fue seleccionado un radio, marca el paso como finalizado y validado:
    if (seleccionado) {
        document.getElementsByClassName("step")[currentTab].className += " finish";
        valid=true;
    }else{
        valid=false;
        alert("Faltan seleccionar opciones");
    }
    return valid; // return the valid status
}
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Julio
Val: 60
Ha disminuido 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

Validar distintos tipos de input

Publicado por Julio (17 intervenciones) el 18/02/2020 08:52:21
Hola.

¿Qué tiene que validar en los textos? ¿Que no esté vacío?

-----------------------------
Aprende la programación desde una perspectiva básica y simplista en [url=https//programacionbasica.es]Programación Básica[/url]
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de grimble
Val: 8
Ha aumentado 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

Validar distintos tipos de input

Publicado por grimble (3 intervenciones) el 18/02/2020 12:05:07
Hola Julio.

Exacto, que no esten vacios. Pero no puedo utilizar required porque el Submit del formulario es el ultimo boton (es multistep)
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Julio
Val: 60
Ha disminuido 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

Validar distintos tipos de input

Publicado por Julio (17 intervenciones) el 18/02/2020 13:15:23
Hola.

Dices que has validado ya los radio input, ¿no? Y te pregunto, ¿y por qué no haces lo mismo con los input de tipo text? Es decir, que los selecciones desde JavaScript y compruebes si están vacíos (contienen la cadena vacía).

No sé si lo haces en el código que has puesto porque no sé a qué corresponde cada cosa exactamente, pero me da que sólo estás cogiendo los radio input y no los text.

-----------------------------
Aprende la programación desde una perspectiva básica y simplista en Programación Básica
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de grimble
Val: 8
Ha aumentado 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

Validar distintos tipos de input

Publicado por grimble (3 intervenciones) el 18/02/2020 16:15:49
Finalmente hice algo similar a lo que decis. No quedó muy prolijo pero funciona.
En la variable y estan todos los input (radio y text) del div que se esta mostrando (es un formulario multistep).

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
for (i = 0; i < y.length; i++) {
    // Si ningun radio fue seleccionado...
    if (y[i].checked == false){
        // add an "invalid" class to the field:
        y[i].className += " invalid";
        // and set the current valid status to false:
    }else{
        sumo++;
            if (sumo>=minimo){ //si no supera el minimo..
                seleccionado=true;
            }
    }
    if ((y[i].value=="") || (isNaN(y[i].value))){
        // add an "invalid" class to the field:
        y[i].className += " invalid";
        // and set the current valid status to false:
    }else{
        sumo++;
            if (sumo>=minimo){ //si no supera el minimo...
                seleccionado=true;
            }
    }
}

Gracias igual!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar