UNIDAD 3: VISUAL BASIC NET ARREGLOS

TEMA 6: TABLAS VISUALES WEBCONTROL ( TABLE )

Tablas visuales nos permiten presentar y manipular informacion al usuario en forma tabular, pero tambien se pueden utilizar para formatear diferentes tipos de informacion en una pagina web(observar que en varias partes de este libro sobre todo en cuadros se han estado usando tablas para formatear la informacion)

Uno de los elementos importantes a entender con respecto a componentes o tablas visuales en el modelo de programacion que se ha estado analizando es que existen los siguientes tipos de tablas visuales:

1.- El objeto TABlE de HTML que es el control mas basico de este tipo.

2.- El WARPER de este objeto es decir HTMLTABLE con una nueva serie de atributos y metodos.

3.- El WEBCONTROL TABLE que permite procesar y manipular un objeto de tipo tabla en forma natural con propiedades y metodos muy comunes a todas las propiedades y metodos de los diversos WEBCONTROLS que se han venido estuduando a lao largo de este libro.

4.- DATAGRID WEBSERVERCONTROL es un excelente objeto que permite desplegar y editar tablas, con la especificacion de que un datagrid debera estar enlazado(databound) fisicamente a una fuente de datos(datasource) del mismo tipo por ejemplo a una variable de tipo arreglo como las que se analizo en temas pasados o por ejemplo a una tabla de ACCESS.

Para proposito de este tema se estudiara y usara el control TABLE DE WEBCONTROL, en razon de que este curso se ha centrado en WEBCONTROLS y el componente objeto o control DATAGRID se analizara y usara mas adelante en la quinta unidad.

Este componente es de los mas importantes para el procesamiento de muchos datos permite concentrar, procesar y mostrar gran cantidad de informacion para la vista del usuario.

Este componente presenta, manipula y procesa conjuntos de datos de tipo strings en forma tabular, es decir en forma de tablas, matrices, cuadros concentrados, ejemplo;

CIA ACME

INGRESOS POR VENTAS MENSUALES

MILLONES DE PESOS

ENE FEB MAR ABR
Suc A 1 2 3 4
Suc B 5 6 7 8
Suc C 9 10 11 12

Recordar que son los datos numericos internos quienes se procesan (es decir se capturan, se realizan operaciones con ellos, se despliegan, etc.), es la informacion externa quien le da sentido.

Es importante tambien entender que un objeto TABLE es una coleccion o conjunto de objetos de tipo TABLEROW ademas de que cada celda de cada renglon tambien es un objeto de tipo TABLECELL.

Algunas de sus propiedades y metodos mas interesantes que se usan en el programa ejemplo son:

CellPadding.- Se usa para definir el tamano del marco o separador de la celdas

GridLine.- Se usa para indicar si el marco debera ser solo vertical, horizontal o ambos.

Text.- Propiedad de la celda(TABLECELL) que se usa para manipular y procesar el dato.

Add.- Otra propiedad de CELL y tambien de ROW que se puede usar para cargar un dato en una celda o una celda en un renglon.

Como se observa de las dos propiedades anteriores CELDA es el elemento mas importante de una TABLA, CELDA tiene muchas propiedades y metodos y en el caso particular de TEXT y ADD recordar que TEXT tiene las caracteristicas de GET-SET que ya se ha analizado en temas anteriores y por tanto sera mas util o usado que el metodo ADD.

Otro aspecto importante a recordar es que TABLE no permite edicion directa por parte del usuario de sus celdas por ese motivo se usara un componente externo TextBox para capturas asi como el evento click de un button apropiado.

Para procesar todos los elementos de la tabla, solo recordar que se deben usar dos ciclos for uno externo para controlar renglones y uno interno para controlar columna.

Si solo se quiere procesar un solo renglon o columna, entonces solo se ocupara el ciclo contrario y el renglon o columna original se daran como constantes.

Ejemplo prog19.aspx

<%@ PAGE LANGUAGE=vb %>
<FORM RUNAT=SERVER>
<ASP:TABLE ID=TABLA RUNAT=SERVER CELLPADDING=10 GRIDLINES=BOTH /></ASP:TABLE>
Ren<ASP:TEXTBOX ID=REN SIZE=2 VALUE=0 RUNAT=SERVER/>
Col<ASP:TEXTBOX ID=COL SIZE=2 VALUE=0 RUNAT=SERVER/><BR>
DAME DATO<ASP:TEXTBOX ID=DATO SIZE=10 RUNAT=SERVER/>
<ASP:BUTTON TEXT=CARGAR ONCLICK=CARGAR RUNAT=SERVER/><BR>
<ASP:BUTTON TEXT=PROCESAR ONCLICK=PROCESAR RUNAT=SERVER/><BR></FORM>
<SCRIPT LANGUAJE=VB RUNAT=SERVER>
SUB PAGE_LOAD(sender As Object, e As EventArgs)
DIM CANTRENG, CANTCOL AS INTEGER
' CREANDO RENGLONES
FOR CANTRENG = 1 TO 3
DIM renglon AS NEW TABLEROW()
' CREANDO COLUMNAS O MEJOR DICHO CELDAS
FOR CANTCOL = 1 TO 4
DIM celda AS NEW TABLECELL()
' cargando celda con un dato cualquiera para inicializar
celda.TEXT = "dato"
' cargando la celda al renglon
renglon.CELLS.ADD(celda)
NEXT CANTCOL
'cargando el renglon a la tabla
TABLA.ROWS.ADD(renglon)
NEXT CANTRENG
END SUB 'PAGE_LOAD
SUB CARGAR(Sender As Object, E As EventArgs)
TABLA.ROWS(REN.TEXT).CELLS(COL.TEXT).TEXT = DATO.TEXT
COL.TEXT=COL.TEXT + 1
DATO.TEXT=""
IF COL.TEXT = 4 THEN
REN.TEXT = REN.TEXT + 1
COL.TEXT = 0
END IF
IF REN.TEXT = 3 THEN
REN.TEXT = 0
COL.TEXT = 0
DATO.TEXT = "TABLA LLENA"
END IF
END SUB
SUB PROCESAR(Sender As Object, E As EventArgs)
DIM temp, R, C AS INTEGER
' procesando y sumandole 10 puntos al dato y desplegando
FOR R = 0 TO 2
FOR C = 0 TO 3
temp = TABLA.ROWS(R).CELLS(C).TEXT
temp = temp + 10
TABLA.ROWS(R).CELLS(C).TEXT = temp
NEXT C
NEXT R
END SUB
</script>

Se empieza creando un objeto de tipo pagina (PAGE) de html la razon de esto es doble, primero porque se necesita crear y tambien inicializar un objeto table y se aprovecha el metodo ONLOAD DE PAGE para realizar este proceso es decir en cuanto se carga la pagina se inicializa la tabla.

En cuanto a la creacion e inicializacion de la tabla recordar que TABLEROW y TABLECELL son objetos y por tanto se usa el operador new.

Recordar tambien que cuando se crean o inicializan tablas se usa la CANTRENG y CANTCOL, sin embargo cuando se va a acceder o manipular las celdas mas adelante en el programa se debera usar notacion normal.

Observar que Celda usa el metodo set en CELDA.TEXT=DATO

Para cargar la celda al renglon respectivo asi como para cargar el renglon a la tabla (otro objeto tambien) se usa el metodo ADD.

Ya dentro del metodo de CARGAR observar que para procesar una celda determinada, se debera usar toda la ruta completa es decir TABLA.RENGLON.CELDA.

Como se esta cargando TEXT de TextBox a TEXT de CELL solo se igualaron las propiedades respectivas.

El resto de codigo en CARGAR ya se analizo en tema anterior solo es para validar no salir de los limites de la tabla avisar cuando ya se lleno y dejarla lista para una nueva captura se usan los dos textboxs como indices de reng y col respectivamente.

En el metodo PROCESO, se usan los ciclos normales de for(renglon) y for(columna), los indices empiezan en 0 y el metodo TEXT de CELL con todas las notas vistas en temas anteriores.

Corrida prog19.aspx

image257.jpg

Un proceso muy comun con tablas cuadros y concentrados es agregarles listas de totales y promedios ya sea por columna o por renglon o ambas por ejemplo:

CIA ACME

INGRESOS MENSUALES

(MILES DE PESOS)

ene feb mar totsuc promsuc
Suc a 1 2 3 4 2
Suc b 4 5 6 15 5
Suc c 7 8 9 24 8
Suc d 10 11 12 33 11
totmes 22 26 30
promes 5.5 6.5 7.9

En este ejemplo aparte de la tabla se ocupan 4 listas dos para totales y dos para promedios.

El Codigo para este tipo de problemas ya se dio en el tema de arreglos normales tipo tabla.

TAREAS VISUAL BASIC NET

1.- Construir en visual basic net un concentrado que despliegue los costos fijos de tres diversos productos que se fabrican en cuatro sucursales de una empresa MAQUILADORA.(aspx)

2.- Construir en visual basic net un concentrado que contenga los ingresos por ventas mensuales de los 4 primeros meses del ano de tres sucursales de una cadena refaccionaria, agregar listas de ingresos totales por mes e ingresos promedios por sucursal. (vb)

3.- Construir en visual basic net un cuadro que contenga las calificaciones de 5 materias de cuatro alumnos cualesquiera, incluir promedios de calificaciones por materia y por alumno. (aspx)

Politica de Privacidad