habilitar /deshabilitar objetos de un form

miguelcalla · #1 (**permalink**) 28/02/2012, 09:02

hola,
tengo un script que valida un dato ingresado en <input type="text" name="rut"> de un formulario inscripcion,

el mismo <input type="text" name="rut"> se repito en varios formularios que ademas de rut tienen otros objetos (select+text+option+button etc.etc)
la llamada al script en cada form lo hago asi:

Código PHP:

Ver original<head>
<script language="javascript" src="include/funciones.js" type="text/javascript"></script>
</head>
<body>
     <input name="cedula" type="text" id="cedula" onChange="check_cedula(this.form);" />
.
.
.
</body>

donde funciones tengo el script js que valida:

Código Javascript:

Ver originalfunction check_cedula(form){
    var cedula = form.cedula.value;
    array = cedula.split( "" );
    num = array.length;
        if ( num == 10 ){
            total = 0;
            digito = (array[9]*1);
            for( i=0; i < (num-1); i++ ){
                mult = 0;
                if ( ( i%2 ) != 0 ) {
                    total = total + ( array[i] * 1 );
                }else{
                    mult = array[i] * 2;
                    if( mult > 9 ){
                        total = total + ( mult - 9 );
                    }else{
                        total = total + mult;
                    }
                }
            }
    
        decena = total / 10;
        decena = Math.floor( decena );
        decena = ( decena + 1 ) * 10;
        final = ( decena - total );
        if (( final == 10 && digito == 0 ) || ( final == digito )) {
            alert( "La c\xe9dula ES v\xe1lida!!!" );
            return true;
        }else{  
            alert( "La c\xe9dula NO es v\xe1lida!!!" );
            return false;
        }
    }else{
        alert("La c\xe9dula no puede tener menos de 10 d\xedgitos");
        return false;
    }
    }

mi duda es como habilitar /deshabilitar los objetos (select+text+option+button etc.etc) del formulario cuando check_cedula se Valida.

RabidFish · #2 (**permalink**) 28/02/2012, 10:30

Hola.

Yo hago una función así:

Código:

function desactivar(elemento) {
	for(var i = 0; i < elemento.length; i++) {
		document.getElementById(elemento[i]).disabled = true;
	}
}

El parámetro elemento es un array que contiene el/los ID/s de el o los elementos que quiero desactivar. Por ejemplo, pude llamarse a esa función así:

Código:

desactivar('campo1', 'campo2');

Que desactivaría los elementos con los ID campo1 y campo2. Puedes añadir desde uno a tantos elementos como quieras. También puedes desactivarlos según su nombre de etiqueta en vez de su ID.

Un saludo.

miguelcalla · #3 (**permalink**) 28/02/2012, 11:18

y la llamada a desactivar desde donde o en que evento , nose

miguelcalla · #4 (**permalink**) 28/02/2012, 18:55

es correcta la forma de llamar ala funcion habilitar() mi intension es habilitar los text una vez que la funcion check_cedula() valide la cedula ingresada previamente

Código PHP:

Ver original<head>
<script type="text/javascript">  
 
        function habilitar(elemento) {
            for(var i = 0; i < elemento.length; i++) {
                document.getElementById(elemento[i]).disabled = false;
            }
        }
        
        function check_cedula(form){
    var cedula = form.cedula.value;
    array = cedula.split( "" );
    num = array.length;
        if ( num == 10 ){
            total = 0;
            digito = (array[9]*1);
            for( i=0; i < (num-1); i++ ){
                mult = 0;
                if ( ( i%2 ) != 0 ) {
                    total = total + ( array[i] * 1 );
                }else{
                    mult = array[i] * 2;
                    if( mult > 9 ){
                        total = total + ( mult - 9 );
                    }else{
                        total = total + mult;
                    }
                }
            }
    
        decena = total / 10;
        decena = Math.floor( decena );
        decena = ( decena + 1 ) * 10;
        final = ( decena - total );
        if (( final == 10 && digito == 0 ) || ( final == digito )) {
            alert( "La c\xe9dula ES v\xe1lida!!!" );
            habilitar('cursos','asesor','nombres','adres');
            return true;
        }else{  
            alert( "La c\xe9dula NO es v\xe1lida!!!" );
            return false;
        }
    }else{
        alert("La c\xe9dula no puede tener menos de 10 d\xedgitos");
        return false;
    }
    }
 
    </script>
</head>
 
<body>
<form id="form_a" name="form_a" method="post" action="">
 
<input name="cedula" type="text" id="cedula" size="10" maxlength="10" value="" onChange="check_cedula(this.form);" />
 
<input name="nombres" type="text" disabled="disabled" id="nombres" size="35" maxlength="35" />
<input name="cursos" type="text" disabled="disabled" id="cursos" size="35" maxlength="35" />
<input name="adres" type="text" disabled="disabled" id="adres" size="35" maxlength="35" />
<input name="asesor" type="text" disabled="disabled" id="asesor" size="35" maxlength="35" />
</form>
</body>

RabidFish · #5 (**permalink**) 29/02/2012, 18:20

Es correcto, cuando se cumple la condición para que la cédula se considere válida llamas a la función habilitar() enviándole los elementos a habilitar como parámetro.
El código es casi el mismo que te di antes, sólo que ahora para habilitar los elementos la propiedad disabled de los mismos va a estar en false, las funciones quedarían así:

Código:

function habilitar(elemento) {
	for(var i = 0; i < elemento.length; i++) {
		document.getElementById(elemento[i]).disabled = false;
	}
}

function deshabilitar(elemento) {
	for(var i = 0; i < elemento.length; i++) {
		document.getElementById(elemento[i]).disabled = true;
	}
}

No olvides incluirlas en el código JavaScript de tu sitio.

Un saludo.

miguelcalla · #6 (**permalink**) 01/03/2012, 07:47

segui tus indicaciones pero cuando ingreso el numero se cedula correcto los text no se habilitan

RabidFish · #7 (**permalink**) 01/03/2012, 20:53

En la parte que llamas a la función habilitar() prueba agregando la línea que hay a continuación y cambia los parámetros de la función por elemento, quedaría así:

Código:

var elemento = new Array('cursos','asesor','nombres','adres');
habilitar(elemento);

La implementación de la función que está arriba de todo tu código JS queda como está, sólo cambia la parte donde la llamas dentro de check_cedula(). Lo que te había dicho antes estaba mal porque estarías mandando varios parámetros de tipo string, cuando debes enviar un sólo array que contiene todos los IDs de los elementos a habilitar. Ahora debería funcionar.

Un saludo.

miguelcalla · #8 (**permalink**) 02/03/2012, 07:26

ok funciona bien ahora si los habilita, pero!
la funcion check_cedula tendria que copiarlo en el <head> de cada formulario para habilitar los ID de ese formulario

lo que queria es crear un archivo funciones.js y hacer la llamada en el <head> de cada formulario asi:
<script language="javascript" src="include/funciones.js" type="text/javascript"></script>

y dentro de funciones obviamene estarian las funciones check_cedula,habilitar,deshabilitar etc.

RabidFish · #9 (**permalink**) 02/03/2012, 23:22

Eso es lo recomendable, copias el código que ya tienes dentro del <head> y lo pones en un archivo de extensión .js (en tu caso en lacarpeta include por lo que veo) y lo incluyes los <head> así:

Código:

<script type="text/javascript" src="include/funciones.js"></script>

Luego en el código HTML cuando llames a las funciones el navegador las va a buscar dentro de ese fichero.
Saludos.