En una aplicación de rieles, deseo que los usuarios puedan ingresar datos sin tener que usar un mouse."Orden de tabulación" en una aplicación de rieles
Para ayudar a hacer esto, quiero establecer el orden en que el cursor se mueve a campos de texto, cuadros desplegables y botones.
¿Hay alguna manera de hacerlo?
No he intentado hacer esto (pero quizás debería). De todos modos, w3.org tiene esto: http://www.w3.org/TR/WCAG10-HTML-TECHS/#forms-keyboard-access que describe brevemente el uso del atributo tabindex. Imagino que tendrías que configurarlo individualmente en tus controles, lo cual sería un poco tedioso, pero no terriblemente.
No sé si funcionará, pero podría considerar usar incrementos de, digamos, 100, para que se puedan hacer adiciones entre los controles existentes sin necesidad de volver a secuenciar toda la lista de control cada vez.
No soy un tipo de rieles, pero he usado otros marcos web MVC-ish. Solo una advertencia :)
Al enviar los elementos del formulario, debería poder agregar atributos adicionales a cada uno (como clase, cambio, etc.). Puede lograr lo que desea estableciendo el valor de tabindex para cada uno, incrementándolo a medida que avanza. El html resultante sería algo como esto:
<input type="text" id="myInput" tabindex=1 />
<select id="mySelect" tabIndex=2>
<option id="myOpt1" value="someValue">Foo!</option>
</select>
Algo así haría el trabajo.
Además, parece que this question has already been posted :)
No estoy 100% seguro, pero supongo que puede tomar el control de la función Tab para dirigirse a sí mismo la orden.
En pseudo código que haría algo así
all_fields = ["field1","field2"]
current = 0
if catch event("tab pressed"){
current = (current+1) %all_fields.size
all_fields[current].focus
}
Una vez que se selecciona el elemento mediante el teclado puede escribir lo que sea o utilice las flechas para navegar por un menú desplegable.
También puede usar tabindex http://www.w3.org/TR/html401/interact/forms.html pero nunca lo hice así que no estoy seguro si funcionaría bien.
La última solución sería colocar los campos en el orden en que desea que las personas los editen.
<%= f.text_field :attribute, :tabindex => 1 %>
continuación, 2, 3, 4, etc.
Editar: subrayado Fuera del "tab_index". Tan cerca.
Además, se puede realizar un método de ayuda para incrementar automáticamente el índice:
def tabindex
@tabindex ||= 0
@tabindex += 1
end
Jeff Peterson es casi correcto.
<%= f.text_field :attribute, :tabindex => 1 %>
Si está utilizando simple_form tendrás que hacerlo de esta manera:
<%= f.input :name, input_html: {:tabindex => 1} %>
tengo uso de variables locales en lugar de variable de instancia va a por favor me explique por qué no su trabajo si tomo tabindex en lugar de @tabindex – railslearner