Cómo hacer que funcione un botón al pulsar ENTER en una página ASPX

Spread the love

Pregunta típica: Cómo hacer que funcione un botón al pulsar ENTER en una página ASPX

Escrito por José Manuel Alarcon el 30 agosto 2008 18:47[Leer sin negritas]

Las páginas ASPX funcionan mediante la inclusión de un formulario único que contiene todo los controles de la página y que, al enviarlo, actualiza ciertos parámetros para mantener el ViewState, saber qué control ha provocado un evento, etc… El funcionamiento basado en un formulario provoca algunos comportamientos indeseados.

Por ejemplo, los cuadros de texto, por defecto, cuando tienen el foco (porque estás escribiendo en ellos) provocan el envío automático del formulario si pulsas ENTER. Si tienes el típico cuadro de búsqueda con un botón o un formulario de recogida de datos con un botón de enviar, al pulsar ENTER conseguirás que se envíe la página pero al no haber pulsado sobre el botón no se detectará el evento correspondiente y por lo tanto no se ejecutará el código del eento click de éste. El resultado es que no se actualiza correctamente la página y simplemente volvemos a tener la misma página exactamente igual y la búsqueda no funciona o los datos no se almacenan.

Seguro que te ha pasado muchas veces al visitar aplicaciones hechas con ASP.NET. De hecho es una de las típicas preguntas que le surgen a todo el mundo: ¿cómo evito esto?

En ASP.NET 1.x tenías que capturar con JavaScript el evento de pulsación de la tecla y actuar en consecuencia. Por suerte desdela versión 2.0 de ASP.NET (y posteriores), tenemos una propiedad estupenda que se puede ajustar en el formulario de la página llamada DefaultButton y que sirve precisamente para evitar este problema.

Así, si ponemos esto:

<form id=”Form1″ runat=”server” defaultbutton=”cmdBuscar”>

conseguiremos que alel hecho de pulsar ENTER y provocar un envío del formulario, en realidad será equivalente a pulsar el botón indicado. De este modo se evita el problema por completo y podemos procesar correctamente el evento 🙂

Por cierto, en la versión 2.0 también apareció una propiedad del formulario relacionada en cierto modo con esta y útil para no tener que scribir un sencillo script por nuestra parte: DefaultFocus. Como se puede esperar esta propiedad nos permite indicar qué control de los disponibles en nuestra página va a tener el foco al cargar la página (generalmente un cuadro de texto).

¡Espero que os sea útil!