Destripando el ASPXGRIDVIEW de las DEVEXPRESS (1/3)

Diseñando el ASPXGridview:

Para diseñar columnas se tiene que dar click en la etiqueta “>” que tiene casi todos los controles de .NET y en elc aso de los controles de la Devexpress tambien.

c1

Como ueden ver existen mucha mas opciones que las que implementa el control estandar de .NET pero vamos por las comlumnas, al pinchar sobre “Columns” veremos un cuadro que esta en blanco pero si adicinamos columnas presionando sobre el primer icono de la izquierda se agregan columnas, en la imagen veran que he colocado varias columnas y veran tambien en la parte derecha la propiedades en la que “Caption” es la que indica la etiqueta de la columna, alli le ponemos la etique que deseemos como se ve en la imagen siguiente:

c2

Ahora voy a mostrar como agrupar columnas, para ello y para el caso de este ejemplo le doy click derecho sobre la columna etiquetada como telefonos y veran ese menu contextual, para el caso de una columna que agrupa varias columnas le doy sobre “Band Column” el efecto ni se siente, ni se ve:

c3

Ahora para crear columnas dependientes agarramos alguna columna y la arrastramos sobre esta columna marcada como “Band column” estas se colocan como subcolumnas dejandolo como en la imagen:

c4

Este es el resultado de esa operacion:

c5

Ahora vamos a setear los anchos de los campos, esto es importante ya que si no se define completamente el ancho de las columnas y el ancho total de la cuadricula, haciendo coincidir la suma de las columnas con el ancho total de la cuadricula podria darse el caso que la cuadricula desatienda a los anchos estirando las columnas al libre albedrio del contenedor llamese un DIV o un control contenedor, bien la imagen ven como setear el ancho, para el ejemplo los campos del telefono los he seteado a 50px, el campo nombre a 200px, el campo direccion a 250px, dejo el campo ID sin tamaño pues lo he seteado con Visible = false, lo que me da un total de 600px que es el ancho que configuro para mi cuadricula.

c6

Pero ahora que pasa aun asi que he seteado el ancho de la columna las columnas de telefono que tiene una etiqueta demaciado amplia hacen a la columna mucho mas grande y esto no es el resultado esperado para ello vamos a las propiedades de la cabecera “HeaderStyle” y las propiedades Horizontalalign a center para centrarlo horizontalmente (cosa que tambien aplico a las otras columnas), Verticalalign a Middle y la mas importante Wrap a true, esta propiedad hace que se encaje el texto de la etiqueta de la columna en el ancho que he determinado, cmo en la imagen:

c7

EL resultado parece ser que no es efectivo pero si vamos a la ejecucion de la pagina veremos esto:

c8

Pero el estilo es terrible, para eso pudes colocarle algun estilo determinado en la version 12 existe la opcion Theme o tema que se elije directamente desde el menu contextual de la cuadricula

c9

Faltan ver los filtros y las agrupaciones tan utiles y una de las mas grandes ventajas de los controles de la devexpress , para ello debemos marcar las opciones Show Group Panel y Enable Filtering

c10

Este es el resultado de nuestro diseño:

c11

Llenado el control de datos:

Ahora no quiero que este ejemplo dependa de una base de datos y por lo tanto de un control de datos, asi que voy a crear por codigo un objeto datatable con el siguiente codigo:

c12

Pero si ejecutas esto despues de escribir este codigo no va dar resultado en la cuadricula por que las columnas no estan enlazadas con los datos para que esto funcione volvamos al modo de diseño y editamos las columnas alli buscamos la propidad Fieldname en donde colocamos el nombre del campo, asegurense de que coincidan exactamenete con los nombrs de las columans del datatable, en el caso del ejemplo pueden ver que las columnas nombre y direccion las he escrito con la primera letra en mayuscula y por ello voya recibir mensajes como este:

c14

Bien si todo queda como debe de ser todas en minusculas por que asi las puse en el campo Fieldname veran esto:

c15

Puedes probar los filtros y las agrupaciones de columnas estas ultimas arrastarndo una columna a la fila superior, la que esta en plomo, todo funciona perfectamente.

Bien por ahora lo dejo aqui, en un proximo articulo tratare de los eventos y los callback’s en javascript.

Acerca de

Antes que nada voy a dejar en claro algo, en este blog escribo como se me place, asi que no busquen errores de ortografia o de redaccion que los van a encontrar a montones y tampoco me critiquen o me digan nada sobre ellos pues no tengo intencion alguna de cambiarlos, lo que escribo lo dejo asi y no lo corrijo,claro esta a menos que sean lineas de codigo. Jorge Prado Anci, profesional en desarrollo de aplicaciones, en especial las dirigidas a bases de datos. He trabajado con VFP en casi todas sus versiones, se algo de Java (que no me gusta, es eso solo no me gusta, es bueno pero no me gusta), lo suficiente de PHP como para tener mi propio CMS(es que sigue sin gustarme por la capacidad de desorden que te permite este “lenguaje”), VB lo conoci y lo deteste tanto que lo olvide al punto de no querer adoptar ni por obligacion a su reemplazante VB .NET (por lo mismo de Java) y si C# este si me encanta y aun que conozco bastante bien el lenguaje, la verdad es que me falta mucho del Framework (del 100% estare en un 65%). Soy un apasionado por el orden (en los proyectos de desarrollo), de la programacion en capas (de MVC conozco pero no he aplicado mucho), los estandares y las condenadas pruebas unitaria. Venga creo que ya con esto fue suficiente.

Tagged with: , , , , , , ,
Publicado en AJAX, c#, devexpress
5 comments on “Destripando el ASPXGRIDVIEW de las DEVEXPRESS (1/3)
  1. jonny sant dice:

    por favor continua con la segunda parte, o si puedes indica donde continua este tema ya que estoy aprendiendo devexpress y me eres de mucha ayuda

  2. jonny sant dice:

    por favor continua con este tema

  3. Pedro dice:

    tengo un problema, necesito que en una celda si tiene datos muy largos que los acorte y le agregue tres puntos, por ejemplo “esto es una prueba” y se acorte a “esto es…” si pueden darme alguna idea de como hacer o utilizar alguna propiedad estaria agradecido, saludos y buen post

  4. […] Mayo del 2013: Como ya quería hacerle un generador de menus para MyRAD4PHP me metí en ello y lo conseguí pudiendolo hacer independiente del framework y así postee com hacerlo lo basé en el desarrollo anterior de como hacer un menu basado en una tabla cíclica, despues alguien me preguntó el porque si soy un defensor a ultranza del software propietario por que hacia cosas como MyRAD4PHP y se atrevió a llamarme “inconsecuente”, primero no soy defensor del Software Propietario y tampoco detesto el Software Libre lo que detesto es que me vengan a decir que la única manera de ser correcto es desarrollar software libre con lo que me dan a enteder que soy un inmoral por desarrollar software propietario a lo que le dedique a forma de respuesta un post, luego yo con mi mania de deprimirme escribí un cuento a mi mismo como que yo mismo hablara de mi ya muerto pero solo fue una de esas noches que me siento muy depresivo, luego rebloguee algunos post que me gustaron entre ellos uno del Mundo Disco saga de libros que aún no termino de coleccionar, como para variar despotriqué terriblemente de la serie televisiva “El chavo del 8″ por que me parece lopeor que he visto en mi vida en la tele, debido al trabajo comensé una saga de artículos sobre las DevExpress y el aspxgridview. […]

  5. Juan Díaz dice:

    Necesito una ayuda: cómo obtengo el valor del key value dela primera fila de una grilla DexExpress en asp.net

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

Escribe tu dirección de correo electrónico para suscribirte a este blog, y recibir notificaciones de nuevos mensajes por correo.

Únete a otros 441 seguidores

Blog Stats
  • 304,137 hits
A %d blogueros les gusta esto: