saltar de campo formulario con enter

binagol · #1 (**permalink**) 02/01/2009, 16:01

Hola a todos, estoy haciendo un formulario, y quiero hacergar la funcion, que cuadno se pulse "enter" en lugar de darle subit al furmulario, salte el cursor al campo siguiente....

como se hace eso??? me pueden orientar con que funcion se hace???
como para saber por donde empezar,.,...

Muchas Gracias De antemano

marcopoloaz06 · #2 (**permalink**) 02/01/2009, 18:19

hola, la misma función la tienes con TAB, no necesitas enter

:)

binagol · #3 (**permalink**) 02/01/2009, 18:52

es ya lose, pero estaba tratando de hacer que con enter cambien de campo del formulario.... tendras idea de como se ahce?????

saludos

marcopoloaz06 · #4 (**permalink**) 02/01/2009, 19:17

aquí hay un tema
http://www.elcodigo.com/cgi-bin/DBre...lave=82&info=4

creo que lo pondre en las faq's de javascript mejorado

saludos
:)

hoberwilly · #5 (**permalink**) 07/01/2009, 12:34

Disculpen amigos, pero la verdad que mi consulta tiene que ver con el tema... a si k preferi no abrir otro post
asi que alli vamos, para mi caso tengo el siguiente codigo que tiene una caja de texto el cual el usuario ingresa la cantidad a solicitar (aki quisiera que tambien para este caso solamente salte las cajas con tan solo dar enter)

Código php:

Ver original<!-- foreach($carro as $k => $v)
  {
?>
<tr> 
    <td align="center"><?php echo $v['id'] ?></td>
    <td><?php echo $v['producto'] ?></td>
    <td align="center"><input type="text" name="cantidad[]" size="4"></td>    //AQUI EL NAME ES cantidad[]
</tr>
  <?php
  }
  ?> -->

Agradeciendo de antemano sus colaboraciones

David · #6 (**permalink**) 07/01/2009, 12:36

Revisa este tema si te sirve:
http://www.forosdelweb.com/f13/no-en...-enter-659820/

hoberwilly · #7 (**permalink**) 07/01/2009, 13:56

Muy buenas David,
revisando el enlace lo adapte y esto kdó pero no me funciona:

Código php:

Ver original<!-- <script type="text/javascript">
function tabular(e,obj)
{
    tecla=(document.all) ? e.keyCode : e.which;
    if(tecla!=13) return;
    frm=obj.form;
    for(i=0;i<frm.elements.length;i++) 
    if(frm.elements[i]==obj)
    { 
        if(i==frm.elements.length-1) i=-1;
        break
    }
    frm.elements[i+1].focus();
    return false;
}
</script>
<body>
<form name="a<?php echo $v['identificador'] ?>" method="post" action="#" id="a<?php echo $v['identificador'] ?>">
<?php
foreach($carro as $k => $v)  
{
?>
<tr>
    <td align="center"><?php echo $v['id'] ?></td>
    <td><?php echo $v['producto'] ?></td>
    <td align="center"><input type="text" name="cantidad[]" size="4" onKeypress="return acceptNumNumero(this) && tabular(event,this);"></td>   
</tr>
<?php
}
?>
</form>
-->

Como que en algo estoy equivocado...

colote · #8 (**permalink**) 08/01/2009, 03:52

Hola , este script es parecido al tuyo, pero tiene una modificacion... yo lo encontre asi como te lo paso ...

Código PHP:

  <script languaje="Javascript"> // este script hace que tabule el enter !!!
function tabular(e,obj) 
        {
            tecla=(document.all) ? e.keyCode : e.which;
            if(tecla!=13) return;
            frm=obj.form;
            for(i=0;i<frm.elements.length;i++) 
                if(frm.elements[i]==obj) 
                { 
                    if (i==frm.elements.length-1) 
                        i=-1;
                    break 
                }
            /*ACA ESTA EL CAMBIO*/
            if (frm.elements[i+1].disabled ==true )    
                tabular(e,frm.elements[i+1]);
            else frm.elements[i+1].focus();
            return false;
        }  

</script>


<body onLoad="document.getElementById('veni').focus();">

Nombre:
<input type="text" size=25 tabindex=1 name="nombre" id="veni" onkeypress="return tabular(event,this)"><br>
Unidad:
<input type="text" size=8 tabindex=2 name="unidad" onkeypress="return tabular(event,this)"><br>

La etiqueta veni, hace que el cursor aparezca ahi cuando carga la pagina ...

Fijate esta linea de tu pagina y ponela asi la parte del onkeypress y fijate si te anda...

Código PHP:

  <input type="text" name="cantidad[]" size="4" onKeypress="return acceptNumNumero(this); tabular(event,this)">

Saludos, Ricardo !!!

hoberwilly · #9 (**permalink**) 08/01/2009, 09:38

Hola amigo colote, mira estoy probandolo el codigo pero hasta el momento no funciona para mi caso...
es bueno mencionartelo lo sgte k esta en el foro:
1. Segun el tema: (como llamar a dos funciones en un onsubmit ) lo que seria correcto: onKeypress="return acceptNumNumero(this) && tabular(event,this);"
2. Según el tema: (Malas costumbres que deberían evitarse ) por lo tanto seria lo correcto:
<script type="text/javascript">

Seguire probandole para mi caso, pero si alguien ya lo logró por favor de compartirlo...y gracias

colote · #10 (**permalink**) 08/01/2009, 10:10

Hola hoberwilly, proba esto a ver que pasa ..

Código PHP:

  <input type="text" name="cantidad[]" size="4" id="veni" onKeypress="tabular(event,this)">

O sea fijate si anda la funcion tabular me refiero, despues le agregamos la otra !!!

Saludos ...

hoberwilly · #11 (**permalink**) 08/01/2009, 10:48

Gracias colote por tu pronta respuesta,
aun no me funciona para mi caso, al dar enter a la primera caja de texto me dirige al submit eliminar que tengo en el codigo... el tema quizas esta en la forma como esta mi pagina:

Código php:

Ver original<!-- <body>
<form name="a<?php echo $v['identificador'] ?>" method="post" action="#" id="a<?php echo $v['identificador'] ?>">
<?php
foreach($carro as $k => $v)  
{
?>
<tr>
    <td align="center"><?php echo $v['id'] ?></td>
    <td><?php echo $v['producto'] ?></td>
    <td align="center"><input type="text" name="cantidad[]" size="4"></td>    //AQUI EL NAME ES cantidad[]
</tr>
<?php
}
?>
<table>
<tr valign="middle"> 
    <td align="center"><input type="submit" name="input_submit" value="Eliminar" onClick="return verifica(this.form['seleccion[]']) && comprueba1();"></td>
    <td>&nbsp;</td>
    <td align="right"><input type="submit" name="input_submit" value="Actualizar" onClick="return vacio(this.form['cantidad[]']) && comprueba2();"></td>
</tr>
</table>
</form> -->

esto kda a groso modo asï:
id producto cantidad
---------------------------
001 producto 1 .100.(caja d texto) <---| //enter y se dirige a submit eliminar
002 producto 2 ......
005 producto 5 .....
009 producto 9 ......

eliminar(submit)
actualizar(submit)

gracias por la ayuda

hoberwilly · #12 (**permalink**) 08/01/2009, 10:51

Disculpen fue error de dedo:

Código php:

Ver original<!-- <input type="text" name="cantidad[]" size="4" onKeypress="tabular(event,this);"> -->

y ademas dejo la funcion final:

Código php:

Ver original<!-- function tabular(e,obj)
{
    tecla=(document.all) ? e.keyCode : e.which;
    if(tecla!=13) return;
    frm=obj.form;
    for(i=0;i<frm.elements.length;i++) 
    if(frm.elements[i]==obj)
    { 
        if(i==frm.elements.length-1)
            i=-1;
        break
    }
    if(frm.elements[i+1].disabled==true)
        tabular(e,frm.elements[i+1]);
    else frm.elements[i+1].focus();
    return false;
} -->

colote · #13 (**permalink**) 08/01/2009, 10:54

Veo que en tus casillas input no pusiste esto : onkeypress="return tabular(event,this)", agregalo y vemos !!!

Saludos

hoberwilly · #14 (**permalink**) 08/01/2009, 11:07

IDEM, funciona no de la manera correcta, como dije que al dar enter a la primera caja de texto me dirige al submit eliminar que tengo en el codigo.

id producto cantidad
---------------------------
001 producto 1 .100.(caja d texto) <---| //enter y se dirige a submit eliminar
002 producto 2 ...... //DEBERIA IR AQUI EL CURSOR???????
005 producto 5 .....
009 producto 9 ......

eliminar(submit)
actualizar(submit)

Gracias

colote · #15 (**permalink**) 08/01/2009, 12:26

Ponelo en la 1º caja de texto que uses, seria lo ideal, asi empezas a cargar los datos

Saludos

hoberwilly · #16 (**permalink**) 08/01/2009, 12:46

Repito amigo, la sintaxis de mi codigo es con un foreach:

Código php:

Ver original<!-- <?php
foreach($carro as $k => $v)               ///FOREACH
{
?>
<tr>
    <td align="center"><?php echo $v['id'] ?></td>
    <td><?php echo $v['producto'] ?></td>
    <td align="center"><input type="text" name="cantidad[]" size="4" onKeypress="return tabular(event,this);"> ></td>
</tr>
<?php
}
?> -->

colote · #17 (**permalink**) 08/01/2009, 17:56

Ahhhhhhhhhhhhhhhhh !!!!!!!!!!!!!!! claro, yo lo tengo para ir caja de texto por caja de texto.
Ahi en ese foreach por logica tendria que funcionar, pero la verdad que me mataste !!!
Alguien que sepa como solucionar esto ??? Ayudaaaaaaaa !!!! :)

Mañana voy a ver si lo puedo probar a ver como funciona ese foreach ..

Saludosm, Ricardo !!!

hoberwilly · #18 (**permalink**) 09/01/2009, 17:26

Gracias de todas maneras Ricardo, de todas maneras seguire buscando en la web...
pero si alguien por ahi lo pueda compartir la idea se agradecera

colote · #19 (**permalink**) 10/01/2009, 04:35

hoberwilly, creo que hice algo parecido a lo que estas haciendo vos, pero con un FOR, no le agarro la mano al foreach jajaja !!!

este repite de 1 hasta el numero que le pongas, hace varias casillas de inputs, y el tabulador con el enter, pasa de los 4 inputs, cuando salis del 4to. input, salta los 2dos, 4, y asi, hasta la cantidad que le pongas ...

Te pego el codigo completo para que lo veas entero !!!
Ahh una curiosidad, !!! Como posteas para que se vea con la lista de numeros y aparezca ese copiar o ver original !!! jejeje !!!

Aca va el Codigo !!!

Código PHP:

 
<html>
<head>
<title>PRUEBA FORO !!!</title>
</head>

<script languaje="Javascript"> // este script hace que tabule el enter !!!
function tabular(e,obj) 
        {
            tecla=(document.all) ? e.keyCode : e.which;
            if(tecla!=13) return;
            frm=obj.form;
            for(i=0;i<frm.elements.length;i++) 
                if(frm.elements[i]==obj) 
                { 
                    if (i==frm.elements.length-1) 
                        i=-1;
                    break 
                }
            /*ACA ESTA EL CAMBIO*/
            if (frm.elements[i+1].disabled ==true )    
                tabular(e,frm.elements[i+1]);
            else frm.elements[i+1].focus();
            return false;
        }  

</script>

<body onLoad="document.getElementById('veni').focus();">
<?php 
include ('conexion.php');
$result=mysql_query("SELECT * FROM materia_prima order by codigo DESC LIMIT 1"  , $conexion);
while($fila = mysql_fetch_array($result))   //mientras haya registros en el resultado
{
$ultimo= $fila['codigo']+1;
}  
?>


<form id="form" name="form" action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
<?php
for($i=1;$i<8;$i++)
{
?>

<legend><font color="silver"><h1>ALTA MATERIA PRIMA</h1></font></legend>

Codigo: >>> <b><?php echo $ultimo+$i;?></b><br>

Nombre Materia Prima:
<input type="text" size=25 name="nombre[]" id="veni" onkeypress="return tabular(event,this)"><br>
Unidad:
<input type="text" size=8  name="unidad[]" onkeypress="return tabular(event,this)"><br>
Costo en Pesos:
<input type="text" size=12 name="costo_mp_pesos[]" onkeypress="return tabular(event,this)"><br>
Costo en Dolares:
<input type="text" size=12 name="costo_mp_dolar[]" onkeypress="return tabular(event,this)"><br>
<?php
}
?>

<br>

<input type="submit" value="REGISTRAR">

</form>
</body>
</html>

Saludos, Ricardo,