Visualização: tabela

Se definido como verdadeiro, os valores formatados das células que incluem tags HTML serão renderizados como HTML. Se definido como falso, a maioria dos formatadores personalizados não funcionará corretamente.

Determina se o estilo de cores alternadas será atribuído às linhas pares e ímpares.

Um objeto em que cada nome de propriedade descreve um elemento da tabela, e o valor da propriedade é uma string, definindo uma classe para atribuir a esse elemento da tabela. Use essa propriedade para atribuir um CSS personalizado a elementos específicos da sua tabela. Para usar essa propriedade, atribua um objeto, em que o nome da propriedade especifica o elemento da tabela e o valor da propriedade é uma string, especificando um nome de classe para atribuir a esse elemento. Depois, defina um estilo CSS para essa classe na sua página. Os seguintes nomes de propriedades são aceitos:

• headerRow: atribui um nome de classe à linha de cabeçalho da tabela (elemento <tr>).
• tableRow: atribui um nome de classe às linhas que não são de cabeçalho (elementos <tr>).
• oddTableRow: atribui um nome de classe às linhas ímpares da tabela (elementos <tr>). Observação:a opção "alternatingRowStyle" precisa ser definida como "true".
• selectedTableRow: atribui um nome de classe à linha da tabela selecionada (elemento <tr>).
• hoverTableRow: atribui um nome de classe à linha da tabela passada (elemento <tr>).
• headerCell: atribui um nome de classe a todas as células na linha de cabeçalho (elemento <td>).
• tableCell: atribui um nome de classe a todas as células da tabela que não são de cabeçalho (elemento <td>).
• rowNumberCell: atribui um nome de classe às células na coluna de número de linha (elemento <td>). Observação:a opção showRowNumber precisa ser definida como "true".

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

Observação:no CSS, alguns elementos substituem outros. Por exemplo, se você especificar uma cor de plano de fundo para um elemento <tr> e um elemento <td>, o último terá precedência sobre o primeiro. Especifique todos os estilos CSS relevantes em cssClassNames para evitar conflitos.

O número da primeira linha na tabela de dados. Usado somente se showRowNumber for verdadeiro.

O número de colunas da esquerda que serão congeladas. Essas colunas permanecerão no lugar ao rolar as outras horizontalmente. Se showRowNumber for false, definir frozenColumns como 0 será igual a null. Porém, se showRowNumber for true, a coluna do número da linha será congelada.

Define a altura do elemento de contêiner da visualização. Você pode usar unidades HTML padrão (por exemplo, "100px", "80em", "60"). Se nenhuma unidade for especificada, o número será considerado como pixels. Se não for especificada, o navegador ajustará a altura automaticamente para caber na tabela, diminuindo o máximo possível no processo. Se definida como menor que a altura necessária, a tabela adicionará uma barra de rolagem vertical (a linha do cabeçalho também ficará congelada). Se definida como "100%", a tabela vai se expandir o máximo possível no elemento do contêiner.

Se e como ativar a paginação pelos dados. Escolha um dos seguintes valores de string:

• "ativar": a tabela vai incluir os botões "Avançar" e "Voltar". Clique nesses botões para realizar a operação de paginação e alterar a página exibida. Também é possível definir a opção pageSize.
• "event": a tabela vai incluir os botões "page-forward" e "Page-back", mas clicar neles acionará um evento "page" e não alterará a página exibida. Essa opção precisa ser usada quando o código implementa a própria lógica de virada de página. Consulte o exemplo de TableQueryWrapper (em inglês) para saber como processar eventos de paginação manualmente.
• "disable": [padrão] a paginação não é compatível.
Tipo: string
Padrão: "disable"

O número de linhas em cada página, quando a paginação está ativada com a opção de página.

Define uma opção especificada para os botões de paginação. As opções são as seguintes:

• "ambos": ativar os botões "Anterior" e "Próximo"
• "anterior": somente o botão "anterior" está ativado
• "próximo": apenas o botão "Próximo" está ativado
• "auto" - os botões são ativados de acordo com a página atual. Na primeira página, apenas a próxima é mostrada. Apenas a versão anterior é exibida na última página. Caso contrário, os dois serão ativados.
• number - o número de botões de paginação a serem exibidos. Esse número explícito vai substituir o número calculado do pageSize.

Adiciona suporte básico a idiomas da direita para a esquerda (como árabe ou hebraico) invertendo a ordem das colunas da tabela, de modo que o zero da coluna seja a coluna mais à direita e a última coluna seja a coluna mais à esquerda. Isso não afeta o índice de colunas nos dados subjacentes, apenas a ordem de exibição. A exibição de idioma bidirecional (BiDi) completa não é compatível com a visualização de tabela, mesmo com essa opção. Essa opção será ignorada se você ativar a paginação (usando a opção de página) ou se a tabela tiver barras de rolagem porque você especificou opções de altura e largura menores do que o tamanho necessário.

Define a posição de rolagem horizontal, em pixels, se a tabela tiver barras de rolagem horizontais porque você definiu a propriedade de largura. A tabela será aberta rolando por muitos pixels além da coluna mais à esquerda.

Se definido como verdadeiro, mostra o número da linha como a primeira coluna da tabela.

Se e como classificar colunas quando o usuário clicar no cabeçalho de uma coluna. Se a classificação estiver ativada, considere configurar também as propriedades "sortAscending" e "sortColumn". Escolha um dos seguintes valores de string:

• "enable": [padrão] os usuários podem clicar nos cabeçalhos das colunas para classificar pela coluna clicada. Quando os usuários clicam no cabeçalho da coluna, as linhas são classificadas automaticamente e um evento "sort" é acionado.
• "event": quando os usuários clicam no cabeçalho da coluna, um evento "sort" é acionado, mas as linhas não são classificadas automaticamente. Essa opção precisa ser usada quando a página implementa a própria classificação. Consulte o exemplo de TableQueryWrapper (em inglês) para saber como processar eventos de classificação manualmente.
• "disable": clicar no cabeçalho de uma coluna não tem efeito.

A ordem em que a coluna de classificação inicial é classificada. Verdadeiro para crescente, falso para decrescente. Será ignorado se sortColumn não for especificado.

Um índice de uma coluna na tabela de dados, pela qual a tabela é inicialmente classificada. A coluna será marcada com uma pequena seta indicando a ordem de classificação.

A primeira página da tabela a ser exibida. Usado somente se page estiver no modo "Ativar/evento".

Define a largura do elemento de contêiner da visualização. Você pode usar unidades HTML padrão (por exemplo, "100px", "80em", "60"). Se nenhuma unidade for especificada, o número será considerado como pixels. Se não for especificada, o navegador ajustará a largura automaticamente à tabela, diminuindo o máximo possível no processo. Se definida como menor que a largura necessária, a tabela adicionará uma barra de rolagem horizontal. Se definida como "100%", a tabela vai se expandir o máximo possível no elemento do contêiner.

Desenha a tabela.

Implementação padrão de getSelection. Os elementos de seleção são elementos de linha. Pode retornar mais de uma linha selecionada. Os índices de linha no objeto de seleção se referem à tabela de dados original, independentemente de qualquer interação do usuário (classificação, paginação etc.).

O botão de alternância da seleção: clicar em uma célula na primeira vez a seleciona; clicar na célula novamente desmarca a seleção, resultando em um evento de seleção, mas nenhum item selecionado no objeto de seleção recuperado.

Chame esse método para recuperar informações sobre o estado de classificação atual de uma tabela que foi classificada (normalmente pelo usuário, que clicou no cabeçalho de uma coluna para classificar as linhas por uma coluna específica). Se você desativou a classificação, esse método não funcionará.

Se você não classificou dados no código ou o usuário não classificou dados selecionando o código, os valores de classificação padrão serão retornados.

• column: (número) índice da coluna pela qual a tabela é classificada.
• ascending - (booleano) verdadeiro se a classificação for crescente, falso se decrescente.
• sortedIndexes - (matriz numérica) matriz de números, em que o índice na matriz é o número da linha classificado (na tabela visível) e o valor é o índice dessa linha na tabela de dados subjacente (não classificado).

Implementação padrão de setSelection(), mas é possível selecionar apenas linhas inteiras ou várias linhas. Os índices de linha no objeto de seleção se referem à tabela de dados original, independentemente de qualquer interação do usuário (classificação, paginação etc.).

Limpa o gráfico e libera todos os recursos alocados.

Evento de seleção padrão, mas somente linhas inteiras podem ser selecionadas.

Acionado quando os usuários clicam em um botão de navegação na página.

Acionado quando os usuários clicam no cabeçalho de uma coluna e a opção de classificação não é "desativar".

• column: (número) índice da coluna pela qual a tabela é classificada.
• ascending - (booleano) verdadeiro se a classificação for crescente, falso se decrescente.
• sortedIndexes - (matriz numérica) matriz de números, em que o índice na matriz é o número da linha classificado (na tabela visível) e o valor é o índice dessa linha na tabela de dados subjacente (não classificado).

O gráfico está pronto para chamadas de métodos externos. Se você quiser interagir com o gráfico e chamar métodos depois de desenhá-lo, configure um listener para esse evento antes de chamar o método de desenho e chame-o somente depois que o evento for disparado.