lunes, 19 de julio de 2010

Mayúsculas en el formulario (UpperCase).

Primero señalar mi aversión a JavaScript. Que no es razonables, pero no puedo evitarlo. Siempre que tengo que hacer cosas en JS me encuentro con problemas que me hacen perder demasiado tiempo.

Planteado el problema de que en la aplicación actual TODAS las entradas han de ser en mayúsculas, cómo resolverlo sin mucho lio:

1. Poner todo en mayúsculas pero solamente visualmente. Por medio de CSS en la clase de estilo que utilizo para los textbox.

.input
{
font-family: 'Lucida Sans';
font-size: 12px;
text-transform: uppercase;
}

2. Poner todo realmente en mayúsculas en el cliente, para descargar el servidor y acelerar el temilla. Lo he puesto en una función de una librería .js para poder modificar el comportamiento en un solo punto.


function toUpper(control) {

if (/[a-z]/.test(control.value)) {
control.value = control.value.toUpperCase();
}
}

Esto requiere una pequeñísima explicación. Le tengo que meter el condicional que solamente me ponga en mayúsculas las letras en minúscula ya que, de no hacerlo así, se inutilizan las teclas de flechas y más cosas malas.


3. Por último, en los controles que quiero este comportamiento le añado el evento:


<asp:TextBox ID="TexBo0x1" runat="server" CssClass="input" onKeyUp="toUpper(this)"></asp:TextBox>

Aquí lo único a reseñar es la necesidad de enviarle el propio control a la librería js para que actualice el valor a la letra en Mayúscula.


Funciona hasta  con acentos… :)

2 comentarios:

Unknown dijo...

maestro gracias por sus aportes a los que estamos aprendiendo
no me funciono en los textarea pero en los otros si GRacias

Anónimo dijo...

17-NOV-2021
Me ayudo bastante yo utilice esto para un formulario let grado = document.getElementById("grado").value= document.getElementById("grado").value.toUpperCase();

GRACIAS