Visualización: tabla

Si se establece como verdadera, los valores con formato de las celdas que incluyan etiquetas HTML se renderizarán como HTML. Si la estableces como falsa, la mayoría de los formateadores personalizados no funcionarán correctamente.

Determina si el estilo de color alternativo se asignará a las filas impares y pares.

Un objeto en el que cada nombre de propiedad describe un elemento de tabla y el valor de la propiedad es una string que define una clase para asignar a ese elemento de tabla. Usa esta propiedad para asignar CSS personalizados a elementos específicos de tu tabla. Para usar esta propiedad, asigna un objeto, en el que el nombre de la propiedad especifique el elemento de la tabla y el valor de la propiedad sea una string que especifique un nombre de clase para asignar a ese elemento. Luego, debes definir un estilo de CSS para esa clase en tu página. Se admiten los siguientes nombres de propiedades:

• headerRow: Asigna un nombre de clase a la fila de encabezado de la tabla (elemento <tr>).
• tableRow: Asigna un nombre de clase a las filas que no son de encabezado (elementos <tr>).
• oddTableRow: Asigna un nombre de clase a las filas impares de la tabla (elementos <tr>). Nota: La opción alternatingRowStyle debe configurarse como verdadera.
• selectedTableRow: Asigna un nombre de clase a la fila de la tabla seleccionada (elemento <tr>).
• hoverTableRow: Asigna un nombre de clase a la fila de la tabla sobre la que se coloca el cursor (elemento <tr>).
• headerCell: Asigna un nombre de clase a todas las celdas de la fila de encabezado (elemento <td>).
• tableCell: Asigna un nombre de clase a todas las celdas de la tabla que no son de encabezado (elemento <td>).
• rowNumberCell: Asigna un nombre de clase a las celdas de la columna de número de fila (elemento <td>). Nota: La opción showRowNumber debe establecerse como verdadera.

Ejemplo: var cssClassNames = {headerRow: 'bigAndBoldClass',
hoverTableRow: 'highlightClass'};

Nota: En CSS, algunos elementos anulan a otros. Por ejemplo, si especificas un color de fondo para un elemento <tr> y un elemento <td>, este último tendrá prioridad sobre el primero. Asegúrate de especificar todos los diseños de CSS relevantes en cssClassNames para evitar conflictos.

El número de fila de la primera fila en la tabla de datos. Solo se usa si showRowNumber es verdadero.

La cantidad de columnas de la izquierda que se inmovilizarán. Estas columnas permanecerán en su lugar cuando te desplaces por las otras columnas de forma horizontal. Si showRowNumber es false, configurar frozenColumns en 0 aparecerá de la misma manera que si se establece en null, pero si showRowNumber se establece en true, se inmovilizará la columna del número de fila.

Establece la altura del elemento contenedor de la visualización. Puedes usar unidades HTML estándar (por ejemplo, "100 px", "80em", "60"). Si no se especifica ninguna unidad, se supone que la cantidad es de píxeles. Si no se especifica, el navegador ajustará la altura automáticamente para adaptarse a la tabla y se reducirá tanto como sea posible durante el proceso. Si se configura un valor inferior a la altura requerida, la tabla agregará una barra de desplazamiento vertical (la fila del encabezado también se inmovilizará). Si se establece en “100%”, la tabla se expandirá lo más posible dentro del elemento de contenedor.

Si deseas habilitar la paginación a través de los datos, y cómo hacerlo. Elige uno de los siguientes valores de cadena:

• "enable": La tabla incluirá los botones para avanzar y retroceder de página. Si haces clic en estos botones, se realizará la operación de paginación y se cambiará la página que se muestra. También puedes establecer la opción pageSize.
• "event": La tabla incluirá los botones para avanzar y retroceder, pero si haces clic en ellos, se activará un evento de "página" y no se cambiará la página que se muestra. Esta opción debe usarse cuando el código implementa su propia lógica de cambio de página. Consulta el ejemplo de TableQueryWrapper para ver un ejemplo de cómo controlar los eventos de paginación de forma manual.
• "disable": [Predeterminado] no se admite la paginación.
Tipo: string
Configuración predeterminada: “disable”

La cantidad de filas en cada página, cuando la paginación está habilitada con la opción de página.

Establece una opción especificada para los botones de paginación. Las opciones son las siguientes:

• "ambos": se habilitan los botones Anterior y Siguiente.
• “prev”: solo está habilitado el botón ant.
• "next": solo está habilitado el botón "Next".
• 'auto': los botones se habilitan según la página actual. En la primera página, solo se muestra la siguiente. En la última página, solo se muestra la anterior. De lo contrario, se habilitan ambos.
• number: La cantidad de botones de paginación que se mostrarán. Este número explícito anulará el número calculado a partir de pageSize.

Agrega compatibilidad básica para los idiomas que se escriben de derecha a izquierda (como el árabe o el hebreo) revirtiendo el orden de las columnas de la tabla, de modo que la columna cero sea la que se encuentre más a la derecha y la última sea la columna de la izquierda. Esto no afecta al índice de columna en los datos subyacentes, solo al orden de visualización. La visualización de tablas no admite la visualización de idioma completo bidireccional (BiDi), incluso con esta opción. Esta opción se ignorará si habilitas la paginación (con la opción de página) o si la tabla tiene barras de desplazamiento porque especificaste opciones de altura y ancho menores que el tamaño requerido de la tabla.

Establece la posición de desplazamiento horizontal, en píxeles, si la tabla tiene barras de desplazamiento horizontales porque estableciste la propiedad de ancho. La tabla se abrirá desplazando tantos píxeles más allá de la columna del extremo izquierdo.

Si se configura como verdadera, muestra el número de fila como la primera columna de la tabla.

Cómo ordenar las columnas cuando el usuario hace clic en un encabezado Si el ordenamiento está habilitado, considera también configurar las propiedades sortAscending y sortColumn. Elige uno de los siguientes valores de cadena:

• "enable": [Predeterminado] Los usuarios pueden hacer clic en los encabezados de las columnas para ordenarlas según la columna en la que se hizo clic. Cuando los usuarios hacen clic en el encabezado de la columna, las filas se ordenan automáticamente y se activa un evento de “orden”.
• "event": Cuando los usuarios hacen clic en el encabezado de la columna, se activa un evento de "ordenar", pero las filas no se ordenan automáticamente. Esta opción se debe usar cuando la página implementa su propio orden. Consulta el ejemplo de TableQueryWrapper para ver un ejemplo de cómo manejar los eventos de ordenación de forma manual.
• “inhabilitar”: hacer clic en el encabezado de una columna no tiene ningún efecto.

El orden en que se ordena la columna inicial. Verdadero para ascendente, falso para descendente. Se ignora si no se especifica sortColumn.

Índice de una columna en la tabla de datos, por la cual se ordena inicialmente la tabla. La columna se marcará con una flecha pequeña que indicará el orden de clasificación.

Es la primera página de la tabla que se mostrará. Solo se usa si page está en el modo de habilitación o evento.

Establece el ancho del elemento de contenedor de la visualización. Puedes usar unidades HTML estándar (por ejemplo, "100 px", "80em", "60"). Si no se especifica ninguna unidad, se supone que la cantidad es de píxeles. Si no se especifica, el navegador ajustará automáticamente el ancho para que se ajuste a la tabla, lo que se reducirá tanto como sea posible durante el proceso. Si se configura un ancho inferior al requerido, la tabla agregará una barra de desplazamiento horizontal. Si se configura en “100%”, la tabla se expandirá lo más posible en el elemento del contenedor.

Dibuja la tabla.

Implementación estándar de getSelection. Los elementos de selección son todos elementos de la fila. Puede mostrar más de una fila seleccionada. Los índices de fila en el objeto de selección hacen referencia a la tabla de datos original, independientemente de la interacción del usuario (ordenamiento, paginación, etc.).

Ten en cuenta que el botón de activación de selección: cuando haces clic en una celda la primera vez, se selecciona. Si haces clic en la celda nuevamente, se anula la selección, lo que genera un evento de selección, pero no se seleccionan elementos en el objeto de selección recuperado.

Llama a este método para obtener información sobre el estado de orden actual de una tabla que se ordenó (generalmente por el usuario, que hizo clic en el encabezado de una columna para ordenar las filas por una columna específica). Si inhabilitaste el ordenamiento, este método no funcionará.

Si no ordenaste datos en el código o el usuario no clasificó los datos mediante la selección de código, se mostrarán los valores de orden predeterminados.

• column: (número) Índice de la columna por la que se ordena la tabla.
• ascending: Valor booleano: verdadero si el orden es ascendente y falso si es descendente.
• sortedIndexes (array numérico): Es un array de números en el que el índice del array es el número de fila tal como está ordenado (en la tabla visible) y el valor es el índice de esa fila en la tabla de datos subyacente (sin ordenar).

Es una implementación estándar de setSelection(), pero solo puede seleccionar filas completas o varias filas. Los índices de fila en el objeto de selección hacen referencia a la tabla de datos original independientemente de la interacción del usuario (ordenamiento, paginación, etc.).

Borra el gráfico y libera todos sus recursos asignados.

Selección de evento estándar, pero solo se pueden seleccionar filas completas.

Se activa cuando los usuarios hacen clic en un botón de navegación de página.

Se activa cuando los usuarios hacen clic en el encabezado de una columna y la opción de ordenamiento no está “inhabilitar”.

• column: (número) Índice de la columna por la que se ordena la tabla.
• ascending: Valor booleano: verdadero si el orden es ascendente y falso si es descendente.
• sortedIndexes (array numérico): Es un array de números en el que el índice del array es el número de fila tal como está ordenado (en la tabla visible) y el valor es el índice de esa fila en la tabla de datos subyacente (sin ordenar).

El gráfico está listo para llamadas de método externas. Si deseas interactuar con el gráfico y llamar a los métodos después de dibujarlo, debes configurar un objeto de escucha para este evento antes de llamar al método de dibujo y llamarlos solo después de que se haya activado el evento.