Habilitar submit si esta todo validado

[Nico0601]

Buenas gente,
Recurro de nuevo a uds porque tengo un problema que nose como resolver.
El tema es el siguiente, tengo una pagina donde importo un archivo pero antes lo imprimo en una tabla para ver si tiene errores, y los campos que tienen errores los marco con rojo para que el usuario los corrija, cuando hace la correccion se va el color rojo.
Luego tengo el submit para subir el archivo correcto, la cuestion es que quiero habilitar el submit cuando este todo OK, asi evito que me suban basura.
Este es el codigo donde valido e imprimo en los input

Código PHP:

<tr>
                <td><input type="text" 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" 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" 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" 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" 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" 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>
 

Lo que nose hacer es que si esta todo bien me habilite el submit.
Espero me haya explicado y me puedan ayudar.

Gracias

[xSkArx]

Eso lo puedes hacer con JavaScript

[martin_9_91]

Acá tenes un ejemplo

http://www.es.hscripts.com/scripts/j...3n-enviar.html

Saludos

[martin_9_91]

Obviamente tenes que adaptarlo a la forma que necesites.

Saludos

[xSkArx]

Amigo martin, no hagas doble post que para eso existe el boton Editar

[martin_9_91]

Una pregunta xSkArx, en donde esta el botón, no lo encuentro.

Gracias

[Nico0601]

Bueno, estoy intentando con esta funcion pero tengo un problema.

Código Javascript:

<script>
function desactivo_submit()
{
    var x = document.forms["form"].elements;
    var desactivar = true;
 
    for (var i = 0; i < x.length; i++) {
        if (x[i].value.length == 0) desactivar = false;
    }
 
    if (desactivar) {
        document.getElementById('submit').disabled = false;
    }
    else {
        document.getElementById('submit').disabled = 'disabled';
    }
}
</script>
 

Mi problema esta aca

Código Javascript:

if (x[i].value.length == 0) desactivar = false;
 

Ahi le estoy diciendo que si esta vacio que desactive el submit.
Pero no le encuentro la vuelta para ponerle las validaciones que tengo mas arriba.
No me funcionan de ninguna manera.

[Dalam]

en vez de poner == 0 ponle == ''
son dos comillas simples por si acaso lo lees como una doble

con eso lo que interpreta es una cadena vacia, pero con == 0 interpreta como false

[Nico0601]

Claro, pero ponerle las comillas es lo mismo que el 0.
Como hago para ponerle la expresion regular que esta mas arriba? O si quiero que sea solo numero?

[martin_9_91]

Capaz esta función te sirve para saber si es numérico:

Un ejemplo sería:

isNaN(123) devolverá False

isNaN("prueba") devolverá True

Saludos

[Nico0601]

Bueno, logre hacerlo asi, pero me funciona a medias.
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.

Código Javascript:

<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 = 'disabled';
    }
}
</script>
Muchas gracias
 

[martin_9_91]

Y así?.

Código Javascript:

<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>
 

[Nico0601]

No, pero esta igual el script

[martin_9_91]

No hay una diferencia mira:

if (desactivar) {
document.getElementById('guardar').disabled = false;
}
else {
document.getElementById('guardar').disabled = true;
}

Fijate que te hice un ejemplo tonto

Código Javascript:

<html>
 
<head>
 
<script>
 
function si(desactivar){
    if (desactivar){
    document.getElementById('bt1').disabled = false;
    }else{
        document.getElementById('bt1').disabled = true;
    }
}
    
 
</script>
</head>
 
<body>
 
<input type='button' id='bt1' value= 'Hola'>
 
<input type='button' id='bt2' onclick="si(false);" value= 'Hola2'>
<input type='button' id='bt2' onclick="si(true);" value= 'Hola3'>
 
</body>
 
</html>
 

Saludos

[Nico0601]

Ah perdon, no lo habia notado.
Pero no funciona tampoco

[martin_9_91]

Que valor tiene la variable

Desactivar antes de entrar al if

if (desactivar) {

??

[Nico0601]

La inicio en True

[martin_9_91]

Si veo que la inicias en true, pero después en el form puede tomar el valor desactivar = false.

Antes del if seguro que devuelve true?.

Otra cosa que note, el boton como se llama

submit o guardar?.

Saludos

[Nico0601]

El boton tiene el id y name "guardar".
Como hago para ver el valor de desactivar? Esta var_dump pero en javascript?

[Nico0601]

Si, el valor es true.
Pude chequearlo con un alert, devuelve true antes del if que me decis

[martin_9_91]

Ok buenísimo.

Mostrame el html del botón por favor.

[Nico0601]

Código HTML:

<input type='submit' name="guardar" id='guardar' value='Guardar datos' class='boton' onclick='saltar();' disabled="disabled"/>
 

[martin_9_91]

Amigo Nico0601 esa función nunca se iba a ejecutar si el botón esta deshabilitado, como ibas a hacer click?.

Lo que se me ocurre es que valides los campos que no estén vacíos y luego habilitas el botón:

Se me ocurre este ejemplo:

Código Javascript:

<html>
 
<head>
 
<script>
 
function desactivo_submit(){
 
   var x = document.forms["formulario"].elements;
    var desactivar = true;
 
    var uno = document.getElementById('txt1').value;
    var dos = document.getElementById('txt2').value;    
    
    if (uno != '' && dos != '') {
        document.getElementById('guardar').disabled = false;
    }
    else {
        document.getElementById('guardar').disabled = true;
    }
}
 
 
</script>
</head>
 
<body>
 
<form id='formulario' action='' >
<input type='text' id='txt1' onchange='desactivo_submit();' />
<input type='text' id='txt2' onchange='desactivo_submit();' />
<br>
<input type='button' id='guardar' disabled="disabled" value= 'Hola'>
</form>
 
</body>
 
</html>
 

Utilizo el onchange para ver verificar si tienen datos los campos.

No se si te sirve, es lo que se me ocurre.

Saludos

[Nico0601]

Claro, pero en ese caso, me serviria unicamente si el archivo a importar tiene dos registros, no?
Porque en mi caso puede tener 1 o 500, tendria que agregar tantos input como registros haya en el archivo, no? Es asi?

[martin_9_91]

Pense que tenías valores fijos.

Necesitas algo así entonces:

Código Javascript:

<html>
 
<head>
 
<script>
 
function desactivo_submit(){
 
    var frm = document.getElementById("formulario");
    var desactivar = true; 
 
    for (i=0;i<frm.elements.length;i++)
    {
        if (frm.elements[i].value == ''){
            desactivar = false;
        }
    }
        
    
    if (desactivar) {
        document.getElementById('guardar').disabled = false;
    }
    else {
        document.getElementById('guardar').disabled = true;
    }
}
 
 
</script>
</head>
 
<body>
 
<form id='formulario' action='' >
<input type='text' id='txt1' onchange='desactivo_submit();' />
<input type='text' id='txt2' onchange='desactivo_submit();' />
<br>
<input type='button' id='guardar' disabled="disabled" value= 'Hola'>
</form>
 
</body>
 
</html>
 

[Nico0601]

Sigue igual que antes, el problema lo tengo cuando estan todos los campos correctos.
Si hay algun error los marco con rojo y al correjirlos se me habilita el submit.

[martin_9_91]

A ver si entiendo.. vos vas cargando los campos y no se te habilita?.

Ahora si vos tenes algún error y lo modificas se habilita bien.

Le pusiste el onchange no?. Es decir todos los input tienen el onchange.

Saludos

[Nico0601]

Pensando un poco en vos alta, viste donde le pongo que si es rojo desactive el submit.
Se le puede agregar otro if

Código Javascript:

for (var i = 0; i < x.length; i++) {
        if (x[i].style.display == "border:2px solid #cc0000;") desactivar = false;
    }......
 

Que diga si el borde es blanco se active? O algo asi, que color tiene por defecto
Por ahi es una burrada! ja! pero se me ocurrio

[Nico0601]

El tema es asi,
Tengo un form donde solo selecciono el archivo a importar y lo imprimo en php validandolo para que el usuario veo lo que sube y me marque con rojo los errores que tiene.
Al corregirlos se le va el color rojo y cuando estan todos los campos bien se activa el submit.
El problema esta cuando el archivo a importar no tiene ningun error.

[martin_9_91]

Mira yo no lo manejaría por estilos, sino por valor.

Es decir si el value == '' ahí le cambió el color. Sino se lo saco.

Algo así:

Código Javascript:

for (var i = 0; i < x.length; i++) {
        if (x[i].value == ''){
            desactivar = false;
             x[i].style.display == "border:2px solid #cc0000;";
        }else{
             x[i].style.display == '';
        }
    }
 

Saludos