Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JavaScript » Habilitar submit con javascript

JavaScript - Habilitar submit con javascript

Volver
Nuevo Tema
<<>>
 
Vista:

Habilitar submit con javascript

Publicado por Nico (4 intervenciones) el 28/11/2013 17:14:30
Buenas gente, tengoun problema con una funcion en javascript, el tema es que quiero habilitar y deshabilitar el boton de submit.
El tema es asi:
Cuando importo el archivo, si hay algun error pinto el borde de rojo, entonces hice una funcion que si el borde es rojo me desactive el submit, hasta ahi todo bien.
El tema es cuando no hay ningun error, el submit aparece deshabilitado.
Como puedo corregir eso?
Esta es la funcion.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<script>
function desactivo_submit()
{
    var x = document.forms["formulario"].elements;
    var desactivar = true;
 
    for (var i = 0; i < x.length; i++) {
        if (x[i].style.display == "border:2px solid #cc0000;") desactivar = false;
    }
 
    if (desactivar) {
        document.getElementById('guardar').disabled = false;
    }
    else {
        document.getElementById('guardar').disabled = true;
    }
}
</script>
Espero puedan ayudarme.
Gracias
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 xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Habilitar submit con javascript

Publicado por xve (2100 intervenciones) el 28/11/2013 21:30:26
Hola Nico, no tienes que deshabilitar el botón del submit... no se como tienes el código, pero si validas tu contenido en el evento onsubmit="return tufuncion()", simplemente devolviendo false, no envía el formulario.

Nos puedes mostrar como lo haces para indicarte correctamente?
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

Habilitar submit con javascript

Publicado por Nico (4 intervenciones) el 28/11/2013 21:41:04
Hola xve! Gracias por responder.
Tengo un form donde tengo solo un boton para importar, ese archivo lo subo al servidor extraigo los campos separados por comas y lo imprimo en una tabla para que el usuario veo lo que esta subiendo y si tiene algun error coloreo el borde con rojo, entonces a medida que va arreglando los errores el color se va. Lo que intento hacer es que no me envie los datos con datos erroneos.
Asi lo imprimo en la tabla
1
2
3
4
5
6
7
8
<tr>
    <td><input type="text" onfocus="desactivo_submit()" name="<?php echo ("trab_apellido".$i);?>" id="<?php echo ("trab_apellido".$i);?>" value="<?php echo $apellido; ?>" style="border:0px; width: 80px;<?php if(!(preg_match("/^([a-z ñáéíóú ÑÁÉÍÓÚ ]{2,50})$/i",$apellido))){ echo "border:2px solid #cc0000;";} ?>" onblur="valida_apellido(<?php echo $i; ?>); esconde(<?php echo $i; ?>);" ></td>

    <td><input type="text" onfocus="desactivo_submit()" name="<?php echo ("trab_nombre".$i); ?>" id="<?php echo ("trab_nombre".$i); ?>" value="<?php echo $nombre; ?>" style="border:0px; width: 80px;<?php if(!(preg_match("/^([a-z ñáéíóú ÑÁÉÍÓÚ ]{2,50})$/i",$nombre))){ echo "border:2px solid #cc0000;";} ?>" onblur="return valida_nombre(<?php echo $i; ?>);" /></td>

    <td><input type="text" onfocus="desactivo_submit()" name="<?php echo ("trab_cuil".$i); ?>" id="<?php echo ("trab_cuil".$i); ?>" value="<?php echo $cuil; ?>" style="border:0px; width: 80px;<?php if(!cuitValido($cuil)){ echo "border:2px solid #cc0000;";}?>" onblur="return valida_cuil(<?php echo $i; ?>);" /></td>

    <td><input type="text" onfocus="desactivo_submit()" name="<?php echo ("trab_basico".$i); ?>" id="<?php echo ("trab_basico".$i); ?>" value="<?php echo $basico; ?>" style="border:0px; width: 80px; text-align:right;<?php if(!is_numeric($basico)){ echo "border:2px solid #cc0000;";} ?>" onblur="return valida_basico(<?php echo $i; ?>);"/></td>

    <td><input type="text" onfocus="desactivo_submit()" name="<?php echo ("trab_bruto".$i); ?>" id="<?php echo ("trab_bruto".$i); ?>" value="<?php echo $bruto; ?>" style="border:0px; width: 80px; text-align:right;<?php if(!is_numeric($bruto)){ echo "border:2px solid #cc0000;";} ?>" onblur="return valida_bruto(<?php echo $i; ?>);"/></td>

    <td><input type="text" onfocus="desactivo_submit()" name="<?php echo ("trab_afiliado".$i); ?>" id="<?php echo ("trab_afiliado".$i); ?>" value="<?php echo $afili; ?>" style="border:0px; width: 50px; text-align:center;<?php if(trim((string)$afili) !== "0" && trim((string)$afili) !== "1"){ echo "border:2px solid #cc0000;";} ?>" onblur="return valida_afiliado(<?php echo $i; ?>);" maxlength="1"/></td>

</tr>

Entonces me quedan pintados los campos con errores.
Que solucion puedo darle? Ya hace dias que llevo con esto....
Gracias
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 xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Habilitar submit con javascript

Publicado por xve (2100 intervenciones) el 29/11/2013 07:46:38
Hola Nico, la verdad es que veo muy complicado tu código... creo que seria mucho mejor crear funciones de javascript y llamarlas cuando las necesites...

Una buena manera de hacerlo, seria algo así:
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
<script>
function validarCadena(id)
{
    var objeto=document.getElementById(id);
    if(objeto.value=="")
    {
        objeto.style.borderColor="red";
        return false;
    }else{
        objeto.style.borderColor="#ccc";
        return true;
    }
}
 
function enviar()
{
    if(validarCadena("nombre")==true)
    {
        return true;
    }
    return false;
}
</script>
 
<style>
input[type=text] {border:1px solid #ccc}

</style>
 
<form action="x.html" method="post" onsubmit="return enviar()">
    <input type="text" id="nombre" name="nombre" onkeyup="validarCadena('nombre')">
    <input type="submit" value="Enviar">
</form>

Queda muy bien diferenciado los estilos, el código javascript y el código html... mucho mas entendible para todo el mundo y mas reutilizable al utilizar funciones.

Coméntanos, ok?
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

Habilitar submit con javascript

Publicado por Nico (4 intervenciones) el 03/12/2013 15:56:44
Hola xve! Gracias por la ayuda y disculpa la demora, asi lo veo mucho mejor al codigo y esta mas entendible.
Ahora, como hago para poner una expresion regular en lugar de las comillas
1
2
3
4
5
6
7
8
9
10
11
12
13
<script>
function validarCadena(id)
{
    var objeto=document.getElementById(id);
    if(objeto.value=="") <-- COMO USO ESTA EXPRESION ACA? (!preg_match("/^([a-z ñáéíóú ÑÁÉÍÓÚ ]{2,50}))
    {

        objeto.style.borderColor="red";
        return false;

    }else{

        objeto.style.borderColor="#ccc";

        return true;
    }
}

Necesito hacer una funcion para cada input con distintos tipos de validacion.
Muchas gracias
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

Habilitar submit con javascript

Publicado por Nico (4 intervenciones) el 03/12/2013 18:28:58
Che no lo puedo sacar, no me funciona....

Que tengo mal???
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script>
function validarCadena(id)
{
    var patron = /^([a-z ñáéíóú ÑÁÉÍÓÚ ]{2,50})$/;
    var objeto = document.getElementById(id);
    if(objeto.match(patron))
    {
        objeto.style.borderColor="red";
        return false;
    }else{
        objeto.style.borderColor="#ccc";
        return true;
    }
}
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 xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Habilitar submit con javascript

Publicado por xve (2100 intervenciones) el 03/12/2013 21:05:42
Hola Nico, creo que tienes el error al coger el valor del id... en vez de hacer así:
1
var objeto = document.getElementById(id);
creo que tiene que ser así:
1
var objeto = document.getElementById(id).value;

Si nos puedes comentar...
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