AYUDA EN LÍNEA
 WINDEVWEBDEV Y WINDEV MOBILE

Este contenido se ha traducido automáticamente.  Haga clic aquí  para ver la versión en inglés.
Ayuda / Desarrollar una aplicación o un sitio web / Controles, ventanas y páginas / Controles: tipos disponibles / Control Tabla
  • Presentación
  • Estado inicial del control Tabla
  • Opciones de visualización
  • Modo de selección de Fila
  • Modo de selección de celdas (la tabla se rellena mediante programación)
  • Opciones de visualización
  • Barras de desplazamiento en una control Tabla
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReportes y ConsultasCódigo de Usuario (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Código Navegador
WINDEV Mobile
AndroidWidget Android iPhone/iPadIOS WidgetApple WatchMac CatalystUniversal Windows 10 App
Otros
Procedimientos almacenados
Presentación
Los controles Tabla permiten mostrar y/o introducir datos. Estos datos pueden estar en memoria o proceder de una fuente de datos o WLanguage Variable.
WEBDEV incluye 3 modos para controles Tabla:
  • Tabla en modo "Servidor".
  • Tabla en modo "Servidor + AJAX".
  • Tabla en modo "Navegador".
Esta ayuda Page presenta los principales ajustes que pueden definirse para un control Tabla en un Page:
También es posible definir la fuente de datos que se muestra en el control. Para obtener más información, consulte Contenido del control Tabla.
Estado inicial del control Tabla
El estado inicial de la control Tabla puede ser:
Estado inicial
Este estado inicial se define al crear la control. Se puede modificar en cualquier momento en la pestaña "UI" de las características del control Tabla.
Las diferentes opciones son las siguientes:
  • Visible: Si esta opción está marcada, el control Tabla será Visible. Si esta opción no está seleccionada, la opción control Tabla estará oculta.. Esta opción puede modificarse con la propiedad Visible.
  • También están disponibles las siguientes opciones para navegador o Ajax controles Tabla::
    • Editable: Los usuarios podrán introducir datos en las diferentes columnas del control si están en modo de edición.
    • En gris: El control Tabla y las columnas se mostrarán en gris. El usuario no podrá introducir datos en el control.
    • Selección (no editable): Los usuarios no podrán introducir datos en las columnas del control. Sin embargo, pueden seleccionar filas en el control: La fila se seleccionará con la banda de selección.
      Observación: El valor del control Tabla corresponde a la fila seleccionada. El código de selección de filas se ejecuta cada vez que se selecciona una fila.
    • Sin edición, sin selección: Los usuarios no podrán introducir datos en las columnas del control. Una fila solo puede seleccionarse utilizando la función TableSelectPlus. Esta fila se seleccionará con la banda de selección. El usuario no podrá cambiar la posición de la banda de selección.
      Observación: El valor del control Tabla corresponde a la fila seleccionada.
      Consejo: Esta opción se recomienda para resaltar una fila con la banda de selección.
Opciones de visualización

Modo de selección de Fila

Los modos de selección determinan cómo se puede seleccionar una fila de control Tabla, tanto por parte del usuario como programáticamente. El modo de selección se define al crear el control. Se puede modificar en cualquier momento en la pestaña "UI" de la ventana de descripción del control Tabla.
Los modos de selección disponibles son los siguientes:
Modo de selección
  • Sin selección: No se mostrará banda de selección, sin embargo, el fila seleccionado tendrá el foco (estará delimitado por puntos).. Se puede seleccionar una fila haciendo clic en esta fila o mediante programación.
  • Selección única: La fila seleccionada se mostrará debajo del banda de selección. Se puede seleccionar una fila haciendo clic en esta fila o mediante programación.
  • Selección múltiple: Tiene la posibilidad de seleccionar varias filas simultáneamente:
    • con la tecla Mayúsculas si las filas son consecutivas o con la tecla Ctrl si las filas no son consecutivas.
    • mediante programación.
    En este caso, el número de barras de selección es igual al número de filas seleccionadas.
Observaciones:
  • Se producirá un error WLanguage si intenta realizar una selección múltiple a través de la programación mientras el modo de selección de control está set a "Selección simple".
  • controles Tabla en modo "servidor": la multiselección sólo está disponible para controles Tabla basada en un archivo de datos.
Caso de selección múltiple: Los elementos seleccionados serán recuperados navegando por las filas seleccionadas en la control. TableSelectCount se utiliza para get el número de filas seleccionadas en el control Tabla:
// Traces the content of the selected rows
i is int
NbSelected is int = TableSelectCount(TABLE_Product)
FOR i = 1 TO NbSelected
Trace("Selected row: " + i)
END

Modo de selección de celdas (la tabla se rellena mediante programación)

Los modos de selección de celdas determinan cómo se puede seleccionar una celda en la control Tabla. El modo de selección se define al crear el control. Se puede modificar en cualquier momento en la pestaña "UI" de la ventana de descripción del control Tabla.
Los modos de selección disponibles son los siguientes:
Modo de selección
  • Sin selección: Las celdas no pueden ser seleccionadas.
  • Selección única: Sólo se puede seleccionar una celda a la vez.
  • Selección múltiple: Puede seleccionar varias celdas con la tecla Shift para celdas adyacentes, o con la tecla Ctrl para celdas no adyacentes.
Observación: La selección de celdas sólo está disponible para AJAX y controles Tabla navegador.
Caso de selección múltiple: Los elementos seleccionados se recuperarán navegando por las columnas seleccionadas en la control. TableSelect obtiene el índice de la columna y fila seleccionado en el control Tabla:
aaColNumToColName is associative array of strings
aaColNumToColName [1] = "COL_Text"
aaColNumToColName [2] = "COL_Num"
aaColNumToColName[3] = "COL_Date"
aaColNumToColName[4] = "COL_Time"
aaColNumToColName[5] = "COL_List"
aaColNumToColName[6] = "COL_CheckBox"
aaColNumToColName[7] = "COL_Image"
aaColNumToColName[8] = "COL_Content"
 
nCol is int
nRow is int
nSub is int = 1
LOOP
nCol = TableSelect(TABLE_MultipleSelection, nInd, tsCellColumn)
nRow = TableSelect(TABLE_MultipleSelection, nInd, tsCellRow)
IF nRow <= 0 THEN
BREAK
END
Trace("[%aaColNumToColName[nCol]%][[%nRow%]]")
nSub++
END

Opciones de visualización

Las opciones de visualización (ficha "General") permiten definir:
  • el modo de visualización de la control Tabla (título de las columnas visualizadas).
  • el modo de selección fila en el control Tabla (presencia de un botón de radio y/o banda de selección).
  • la presencia de un menú contextual.
Dependiendo del tipo de control (Servidor, Servidor + AJAX o Navegador), algunas opciones pueden no estar disponibles.
Opciones de visualización
Las opciones disponibles son:
  • Con títulos de columna: el título definido para las columnas se utiliza como título de columna.
    Observación: La altura del título de la columna se puede especificar en la pestaña "UI" de la description de la control Tabla. Esta altura también se puede modificar en el editor, con el ratón. Si un fondo Image es associated con el título de la columna, el Image se genera automáticamente con el tamaño especificado.
  • Si se selecciona la opción "Con títulos de columna", el botón "Editar sobre-encabezados de columnas" permite definir títulos adicionales que se muestran encima del título de una o más columnas. Para definir un título-encabezado de columna:
    1. Abra la pestaña "Detalles" de la ventana control Tabla description ("description" en el menú contextual).
    2. Haga clic en "Editar sobre-encabezados de columnas".
    3. Las diferentes columnas de tabla se muestran en la ventana que se abre.
      Sobre-encabezado de columnas

      En esta ventana, puede:
      • 1: Agregar títulos (botón"+") o eliminar títulos (botón"-").
      • 2: Redimensionar y fusionar las diferentes celdas de las cabeceras de título pasando el ratón por encima de los separadores..
      • 3: Renombrar las celdas de las cabeceras de título haciendo clic en ellas.
    4. Validar.
      Observación: Si se habilitan los títulos de las columnas, se ignora la modificación de los títulos de las columnas a través de la ventana de description de la columna: el título debe ser modificado en la ventana de edición de los títulos de las columnas.
  • Columna de selección de la fila actual: se encuentra un botón de radio delante de cada fila del control Tabla. Este botón de opción se utiliza para ver y/o seleccionar la fila actual..
    Esta opción sólo está disponible para controles Tabla en modo "Servidor"..
  • Banda de selección: se utiliza un banda de selección para ver y/o seleccionar el fila actual.
    Esta opción sólo está disponible para controles Tabla en modo "Servidor"..
  • Con menú contextual de exportación: aparece un menú contextual associated con el control (Menú contextual Icon). Este menú contextual permitirá al usuario exportar el contenido de la control Tabla a un archivo Excel, Word o XML (con hoja de estilo). Este archivo se descargará en la el equipo del usuario de la web.
    La Icon que representa el menú contextual se puede personalizar: para ello, especifique la ruta de la imagen solicitada en la pestaña "Style" de la descripción del elemento control Tabla ("Other").. El tamaño de la Image utilizada debe ser de 16 píxeles x 15 píxeles.
    Esta opción sólo está disponible para controles Tabla en modo "Servidor" y "Servidor + AJAX"..
Ejemplo: Servidor control Tabla con títulos de columnas, banda de selección, botón de radio y menú contextual:
control Tabla
Barras de desplazamiento en una control Tabla
La barra de desplazamiento depende del tipo de control Tabla: Servidor, Servidor + AJAX o Navegador.
controles Tabla en modo "Servidor " no incluyen ninguna barra de desplazamiento. Por otra parte, puede definir un número máximo de filas por página (pestaña "General" en el control Tabla description). En este caso, se crea automáticamente un control Paginación y se asocia con el control Tabla. Los botones del buscapersonas permiten al usuario visualizar el contenido de la control Tabla.
controles Tabla en modo "Servidor + AJAX " se muestran como el controles Tabla de Windows . Aparecerán barras de desplazamiento. Permitirán al usuario ver todos los elementos que se encuentran en el control. Las barras de desplazamiento se configuran en la pestaña "General" de la ventana de description de control Tabla.
Las opciones posibles son las siguientes:
  • Definir el modo de la barra de desplazamiento horizontal y vertical.
  • Control Tabla sin barra de desplazamiento vertical: Todo el contenido de la tabla control se mostrará en la Page, sin limitar el número de filas.
  • Control Tabla con barra de desplazamiento vertical:
    • Si se marca "Poner todo el contenido en la caché del navegador", todo el contenido de la control Tabla se carga en la caché del navegador. En este caso, la Page puede tardar más en cargarse, pero no es necesario volver al servidor cuando se utiliza la barra de desplazamiento. Esta opción está especialmente recomendada para la controles Tabla Ajax utilizada en las páginas de Active WEBDEV. En este caso, la barra de desplazamiento vertical se genera automáticamente.
    • Si no se marca "Poner todo el contenido en la caché del navegador", se restablece el comportamiento de Default de las versiones anteriores. Sólo se almacena en caché un número limitado de filas alrededor del área visualizada en el control Tabla.
controles Tabla en modo "Navegador " se muestran como Windows controles Tabla. Las barras de desplazamiento se configuran en la pestaña "General" de la ventana de description de control Tabla.
Las opciones posibles son las siguientes:
  • Definir el modo de la barra de desplazamiento horizontal y vertical.
  • Control Tabla sin barra de desplazamiento vertical: Todo el contenido de la control Tabla se mostrará en la Page, sin limitar el número de filas.
  • Control Tabla con barra de desplazamiento vertical: Una barra de desplazamiento vertical permite al usuario desplazarse por las filas de control Tabla.
Versión mínima requerida
  • Versión 9
Comentarios
Haga clic en [Agregar] para publicar un comentario

Última modificación: 08/03/2023

Señalar un error o enviar una sugerencia | Ayuda local