Cambiar el focus automaticamente

cargosan · #1 (**permalink**) 16/01/2007, 02:25

Hola amigos tengo un formulario con un numero de cuenta separado en cuatro campos (4 digitos, 4 digitos, 2 digitos,10digitos) y me gustaria que cuando escribiese un campo pasase al otro si tener que darle al tabulador. Es posible?

Muchas gracias

Valkam · #2 (**permalink**) 16/01/2007, 02:32

Lo primero que se me ocurre es que vayas contando el número de dígitos que va introduciendo el usuario en cada campo y cuando completa uno hagas un focus del siguiente

cargosan · #3 (**permalink**) 16/01/2007, 02:35

Cita:

Iniciado por Valkam

Lo primero que se me ocurre es que vayas contando el número de dígitos que va introduciendo el usuario en cada campo y cuando completa uno hagas un focus del siguiente

Podrias ser algo más especifico, por favor? soy bastante novato en javascript y no estoy muy puesto en eventos el codigo html de lo cuatro campos es muy simple te lo muestro

Código HTML:

<input name="cuentacorriente1" type="text" size="4" maxlength="4"> <input name="cuentacorriente2" type="text" size="4" maxlength="4"> <input name="cuentacorriente3" type="text" size="2" maxlength="2"> <input name="cuentacorriente4" type="text" size="10" maxlength="10">

Muchas gracias por tu rapida respuesta

Valkam · #4 (**permalink**) 16/01/2007, 02:56

Te dejo una función a ver si te vale

Código PHP:

  <html>
<head>
<script language="javascript">

  function pasaSiguiente(actual, siguiente, longitud)
  {
         if((actual.value.length + 1) == longitud)
                siguiente.focus();
  }

</script>
</head>

        <input name="cuentacorriente1" id="cuentacorriente1" type="text" size="4" maxlength="4" onKeyPress="pasaSiguiente(this, document.getElementById('cuentacorriente2'), 4)"> 
<input name="cuentacorriente2" id="cuentacorriente2" type="text" size="4" maxlength="4">


</html>

La función pasaSiguiente es llamada cada vez que se pulsa una tecla dentro de la caja de texto. Le paso el objeto que representa a la caja, el siguiente campo a donde tiene que saltar y la longitud que debe tener el campo para poder saltar al siguiente. De esta forma la puedes reutilizar para los demas campos (de 2 y 10 digitos). En la función únicamente comprueba que tenga esa longitud y en ese caso salta al siguiente campo

cargosan · #5 (**permalink**) 16/01/2007, 03:08

Muchisimas gracias!!

Era justo lo que queria, pero le he tenido que quitar el +1 porque si no me escribia un caracter de menos, pero por lo demas funciona perfectamente

Valkam · #6 (**permalink**) 16/01/2007, 03:13

Ok, solo lo probe en Firefox y me funcionó bien. Quizás en Firefox se llame a la función antes de actualizar el valor del campo. Por eso le puse un + 1. ¿En que navegadores lo has probado?

cargosan · #7 (**permalink**) 16/01/2007, 03:27

He probado en el explorer pero ahora que me dices es a lo mejor tengo que verificar sobre que navegador se trabaja y asi actuar de una manera u otra no?

Valkam · #8 (**permalink**) 16/01/2007, 03:43

Es posible, aunque seguro que hay una solución universal y los foreros seguro que en breve la encuentran

derkenuke · #9 (**permalink**) 16/01/2007, 09:17

Sí, el problema que tenéis con el +1 ocurre por utilizar el onKeyPress. Si utilizamos el onKeyUp tendremos más control sobre cuándo lanzamos la función. Si utilizamos ese código con onkeyup funciona perfectamente en firefox por lo menos.

Lo que no sé es por qué no me funciona en IE...