Seleccionar Row en un ASP.NET GridView

Al utilizar un GridView en ASP.NET podrás observar que no se pueden seleccionar las tuplas de dicho control, o cual es necesario cuando se requiere seleccionar un indice de dicho controlador.

A continuación te mostramos una práctica donde se requiere seleccionar un row de un GridView  para extraer los datos de un socio de gimnasio (id_Socio, nombre_Socio, direccion_Socio, peso_Socio, altura_Socio, ocupacion_Socio, vigencia) y de esta manera mostrar los datos en su textBox correspondiente,  los pasos que te mostramos a continuación son necesarios para lograr dicha funcionalidad.

Para esta práctica necesitaras:

-Visual Studio 2008+
-ASP.NET
-Formulario donde se implementara la práctica con un GridView.

Bien, comencemos.

Paso 1:

Dentro de la vista de diseño de Visual Studio, seleccionamos el GridView en el que deseamos implementar el seleccionado y en sus propiedades, seleccionamos los eventos.

Paso 2:

Seleccionamos el evento llamado SelectedIndexChange, este evento puede crear un controlador de eventos para determinar cuando el indice seleccionado de una herramienta, en este caso del GridView ha cambiado.  

Esto puede ser útil cuando se necesita mostrar información en otro control basado en la selección actual del GridView.

El evento puede utilizar el controlador de eventos para este evento para cargar la información en los demás controles.

Paso 3:

Para esta práctica es necesario agregar la librería Drawing escribiendo using System.Drawing; que proporciona acceso a funcionalidades de gráficos.

Paso 4:

Dentro del evento anteriormente agregado agregaremos un foreach el cual se encargara de recorrer los rows del GridView, y adentro debemos de crear una condición con la que revisaremos si la tupla seleccionada sea igual a la tupla en la que se encuentra el recorrido.

Si coincide a continuación cambiaremos el color de la tupla una vez encontrada:
row.BackColor =ColorTranslator.FromHtml(color_deseado); 

Y se coloca donde se desea colocar la información recuperada en este caso recuperaremos la información en text.
textoClave.Text = tablaSocios.SelectedRow.Cells[0].Text;

Si no coinciden las tuplas se regresara al color que anteriormente se tenia, esto es para evitar dejar el color en las tuplas cuando fueron seleccionadas antes y es cambiada la tupla en selección actual.
row.BackColor =ColorTranslator.FromHtml(color_anterior); 

Paso 5:

Para terminar se agrega el evento RowDataBound  en este evento cada fila en el control debe estar enlazado a un registro en el origen de datos. 

El evento se desencadena cuando una fila de datos esta enlazado a datos en otro control. Dentro del evento colocaremos e.Row.Attributes[“onclick”] = Page.ClientScript.GetPostBackClientHyperlink(tablaSocios, “Select$” + e.Row.RowIndex);

Esto para recuperar los atributos de la tabla en este caso tablaSocios, con un Select y el indice.

Ahora podemos seleccionar la tupla del GridView que queramos y se recuperaran los datos.

 

Y de esta manera terminamos una práctica mas, donde aprendimos como seleccionar y recuperar datos del GridView .

 

 

 

Customizar Rows en un ASP Gridview

La manera más fácil de utilizar un ASP Gridview es que a partir de un origen de datos seleccionado Visual Studio, cree automáticamente las columnas y el tipo de control en el cual se representaran los datos, generalmente de tipo ASP BoundField.

Pero cada caso es muy diferente a los demás, en ocasiones esto no es muy conveniente debido a la extensa longitud de algunos datos.

Desarrollando un acortador de URL’s me encontré con un dato que quería mostrar en una columna de un ASP Gridview que era demasiado extenso (Url Larga), y al darle un ancho fijo a la columna lo único que hacia era distribuir el contenido en varias líneas. Eso si la cadena tenía espacios, si no, no respetaba el ancho de la columna.

Entonces, como no era necesario mostrar la cadena completa (Url Larga), decidí, hacer lo siguiente.

Dentro de la etiqueta <Columns> del Gridview
1.- Cambiar el tipo ASP BoundField por el tipo ASP ItemTemplate
2.- Dentro de <ItemTemplate>, Colocar un
<div> con el ancho requerido, y el estilo overflow:hidden.
3.- Dentro del div evaluar la expresión del origen de datos <%# Eval(“Url Larga”)%>

De esta manera, dentro del div se mostrara el contenido de la expresión, el ancho no cambiara a pesar de la longitud del contenido, y con el estilo nos aseguramos que el texto que se salga del div no aparezca, quedando algo asi:

De igual manera para la columna Url Corta, modifique el BoundField por ItemTemplate para poder mostrar este campo como un enlace <a>

Gracias