Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JQuery » Validación de varios textbox dentro de un determinado div

JQuery - Validación de varios textbox dentro de un determinado div

Volver
Nuevo Tema
<<>>
 
Vista:
sin imagen de perfil

Validación de varios textbox dentro de un determinado div

Publicado por Pablo (5 intervenciones) el 04/01/2016 13:39:28
Buenas:
Tengo el siguiente problema con jquery, tengo varios div que contienen varios textbox:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<div id="div1">
       <input type="text" class="input_div1"/>
       <input type="text" class="input_div1"/>
       <input type="text" class="input_div1"/>
       <input type="text" class="input_div1"/>
</div>
 
<div id="div2">
       <input type="text" class="input_div2"/>
       <input type="text" class="input_div2"/>
       <input type="text" class="input_div2"/>
       <input type="text" class="input_div2"/>
</div>
 
<div id="div3">
       <input type="text" class="input_div3"/>
       <input type="text" class="input_div3"/>
       <input type="text" class="input_div3"/>
       <input type="text" class="input_div3"/>
</div>

Mi consulta seria: ¿ Como podría validar con jquery si los textbox de un x div estan con datos o alguno tiene datos ?
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 Jordi

Validación de varios textbox dentro de un determinado div

Publicado por Jordi (12 intervenciones) el 04/01/2016 14:29:51
Hola Pablo,

Para recoger los datos con jquery de inputs dentro de un día, puedes hacerlo de la forma:

1
2
3
4
5
6
7
8
9
10
11
var inputs = $("#div1 > input");
// o teniendo clases dentro de los div...

var inputs = $(".input_div1");
 
// una vez tenemos el array, podemos iterar 

for (var i = 0; i < inputs.length; i++) {
   var in = inputs[i].val();
   if (in.length > 0) {
 // no está vacío 

  }
}
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
sin imagen de perfil

Validación de varios textbox dentro de un determinado div

Publicado por Pablo (5 intervenciones) el 04/01/2016 17:26:54
Muchas gracias Jordi por responder, probé el codigo mediante la consola de Google Chrome y me reclamaba el siguiente error 'Unexpected token in', asi que cambie la variable in por otra y para verificar si andaba todo en orden le indique unas jAlert pero no indica ningun aviso, estos fueron los cambios que deje ahora:

1
2
3
4
5
6
7
8
9
10
var inputs = $("#div1 > input[type=text]");
 
for (var i = 0; i < inputs.length; i++) {
	var ins = inputs[i].val();
	if (ins.length > 0) {
		jAlert("Existen campos con datos");
	}else{
		jAlert("Los campos estan vacios");
	}
}
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 Danny

Validación de varios textbox dentro de un determinado div

Publicado por Danny (7 intervenciones) el 04/01/2016 22:25:55
te dejo mi version, espero te sirva:

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
36
37
38
39
40
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
function mm()
{
	for (var i = 1; i <= 3; i++) {
		$("#div"+i).children("input").each(function(){
			if($(this).val() != "")
				alert($(this).val())
		})
	}
}
</script>
 
<div class="trescuadros2">
<form name="ejer">
<div id="div1">
       <input type="text" class="input_div1"/>
       <input type="text" class="input_div1"/>
       <input type="text" class="input_div1"/>
       <input type="text" class="input_div1"/>
</div>
 
<div id="div2">
       <input type="text" class="input_div2"/>
       <input type="text" class="input_div2"/>
       <input type="text" class="input_div2"/>
       <input type="text" class="input_div2"/>
</div>
 
<div id="div3">
       <input type="text" class="input_div3"/>
       <input type="text" class="input_div3"/>
       <input type="text" class="input_div3"/>
       <input type="text" class="input_div3"/>
</div>
 
<input type="button" value="Probar" onclick="mm()" />
 
</form>
</div>
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
sin imagen de perfil

Validación de varios textbox dentro de un determinado div

Publicado por Pablo (5 intervenciones) el 11/01/2016 16:34:15
Probé ese codigo y no me ha resultado :(.
Muchas gracias de todas formas.
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 Danny

Validación de varios textbox dentro de un determinado div

Publicado por Danny (7 intervenciones) el 11/01/2016 16:37:29
Que es exactamente lo que no te resulto? el codigo que te envie debia ser modificado pero funciona, que error te dio?
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
sin imagen de perfil

Validación de varios textbox dentro de un determinado div

Publicado por Pablo (5 intervenciones) el 11/01/2016 19:27:53
tomé el codigo dentro del for y lo probé en la consola de chrome y no dio ningun resultado, lo probé directamente en mi codigo por si fuese problema del chrome y tampoco, aqui está:

1
2
3
4
5
6
7
$("#div1").children("input[type=text]").each(function(){
	if($("#div1").children("input[type=text]").val() == ""){
		alert("Hay campos vacios");
	}else{
		alert("No hay campos vacios");
	}
});
había probado en el if que en vez de if($("#div1").children("input[type=text]"), fuera if($(this) y tampoco arroja resultados. Esto lo habia hecho para probar el codigo por div del sitio web.
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 Danny

Validación de varios textbox dentro de un determinado div

Publicado por Danny (7 intervenciones) el 11/01/2016 20:05:11
No es asi amigo, la validacion que te puse es clara, solo debias modificar un poco y hacer esto

1
2
3
4
5
6
7
8
var validacion = "No hay campos vacios"
$("#div1").children("input").each(function(){
	if($(this).val() == ""){
		validacion = "Hay campos vacios"
	}
})
 
alert(validacion)
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
sin imagen de perfil

Validación de varios textbox dentro de un determinado div

Publicado por Pablo (5 intervenciones) el 11/01/2016 21:07:14
Aplique el mismo codigo pero el mensaje del alert no cambia sea cual sea el caso, perdon por la insistencia.
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 Danny

Validación de varios textbox dentro de un determinado div

Publicado por Danny (7 intervenciones) el 11/01/2016 21:19:22
Revisa bien que no tengas errores de javascript, porque he probado esto en chrome, ie, firefox y funciona muy bien para lo que solicitas, espero que puedas solventar tu problema, sino lamento no haberte podido ayudar


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
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
function mm()
{
 
var validacion = "No hay campos vacios"
$("#div1").children("input").each(function(){
	if($(this).val() == ""){
		validacion = "Hay campos vacios"
	}
})
 
alert(validacion)
}
</script>
 
<div class="trescuadros2">
<form name="ejer">
<div id="div1">
       <input type="text" class="input_div1"/>
       <input type="text" class="input_div1"/>
       <input type="text" class="input_div1"/>
       <input type="text" class="input_div1"/>
</div>
 
<input type="button" value="Probar" onclick="mm()" />
 
</form>
</div>

Suerte
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