Componentes de dados

Dados

Oculto

You can use the Hidden component to create a resource property that can be custom set inside a form. It doesn't display in rendered forms.

Contêiner

You can use the Container component to wrap a set of fields into an object with a container key. A Container with the key financialPerformance submits as:

{
                    data: {
                    financialPerformance {
                    grossProfitMargin: "0.83",
                    [tab]netProfitMargin: "0.43"
                    }
                    }
                    }

Mapa de Dados

Tipo de dados: System.Collections.Generic.Dictionary<System.String,System.String>

Use o componente do Mapa de dados para criar pares de chave-valor. O componente é editável no runtime, de forma que os usuários podem criar novos pares de chave-valor, clicando em Adicionar outro.

Observação:

O campo Chave é, por padrão, um Campo de Texto e não pode ser alterado. O campo Valor pode ser alterado com outros componentes.

• Rótulo para a coluna Chave - defina um rótulo para mostrar para a coluna Chave . Se deixado em branco, o nome da coluna permanecerá como Chave.
• Desabilitar Adicionar/Remover Linhas — oculta os botões que permitem adicionar ou remover linhas quando o formulário é exibido.
• Mostrar coluna Chave antes do Valor — selecione se você deseja que a coluna Chave seja exibida antes da coluna Valor .
• Adicionar outro texto — defina o texto a ser exibido para o botão Adicionar outro texto .

A guia Layout é específica apenas para o componente Mapa de dados :

• Atributos HTML - adicione atributos HTML personalizados ao componente.
  Observação:

  Atributos de outros componentes dominarão os atributos que você configurar.

• Sobreposição de PDF - aplique configurações de estilo a formulários de PDF.

Para saber como usar o componente Mapa de dados, confira o tutorial Usando o componente Mapa de dados.

Grade de Dados

You can use the Data Grid component to render multiple rows of data, similar to a data table. You can drag and drop multiple components in the Data Grid to match your use case.

In the Form Renderer window, the rows inside the Data Grid component can be added or removed.

• Disable Adding / Removing Rows - hides the buttons that allow adding or removing rows when the form renders.
• Allow Reorder - reorder rows by dragging and dropping them.
• Equal Column Width - makes the widths of columns equal.
• Enable Row Groups - allows separating rows into groups. Add groups, label them, and select the rows for each group.
• Initialize Empty - the Data Grid will have no visible rows when initialized.

Editar Grade

You can use the Edit Grid component to render multiple rows of data, similar to a data table. You can drag and drop multiple form components into the Edit Grid, to capture loads of data.

When the form renders, you can add a duplicate of the Edit Grid, by clicking Add Another.

• Open First Row when Empty - opens the first row when the Edit Grid is empty.
• Desabilitar Adicionar/Remover Linhas — oculta os botões que permitem adicionar ou remover linhas quando o formulário é exibido.
• Add Another Text - changes the name of the Add Another button.
• Save Row Text - changes the text of the Save Row button.
• Remove Row Text - changes the text of the Remove Row button.

A guia Modelos é específica apenas para o componente Editar grade . Os modelos Cabeçalho,Linha e Rodapé permitem personalizar a grade usando JavaScript. É possível modificar o tipo de componentes que é exibido nas linhas de uma grade ou a aparência do cabeçalho/rodapé.

Modelo de Cabeçalho

This is the Lodash Template used to render the header of the Edit Grid component.

Importante:

O modelo de cabeçalho não funciona com Ações de formulário.

Existem duas variáveis disponíveis:

• value - the array of row data.
• components - the array of components in the grid.

Modelo de Linha

This is the Lodash Template used to render each row of the Edit Grid component.

Importante:

O modelo de linha não funciona com ações de formulário.

Existem três variáveis disponíveis:

• row - object of one row's data.
• components - the array of components in the grid.
• state - current row's state (draft/saved).

To add Click type events, add the following classes to elements: editRow and removeRow.

Modelo de Rodapé

This is the Lodash Template used to render the footer of the Edit Grid component.

Existem duas variáveis disponíveis:

• value - the array of row data.
• components - the array of components in the grid.

Tabela de Dados

Você pode usar o componente Tabela de dados para renderizar várias linhas de dados, semelhante a uma tabela de dados. A Tabela de dados é um componente somente leitura que você pode usar para exibir grandes quantidades de dados. É possível arrastar e soltar vários componentes de formulário no componente Tabela de dados .

• Classificável — classifica os dados dentro das colunas em ordem crescente ou decrescente. Você classifica os dados no runtime.
• Filtrável — filtrar dados dentro de cada coluna. Filtrar os dados no runtime.
• Coluna(s) Dimensionável — altera a largura das colunas no runtime. O recurso Redimensionável de Coluna(s) permite que você veja melhor os dados dentro das colunas.
• Paginação — exiba os dados do componente Tabela de dados em páginas numeradas. A capacidade de paginação também inclui a configuração do número de itens por página.
• Edição em linha - Permita a edição no tempo de execução, de forma semelhante a como você faria no Excel.

Classificável

É possível classificar os dados dentro de colunas em ordem crescente ou decrescente. Você classifica os dados no Runtime, no formulário.

Os dados na Tabela de dados são exibidos na mesma ordem que na tabela de dados de entrada. Para classificar todos os dados na Tabela de dados, clique em qualquer cabeçalho de coluna no formulário.

• First click sorts the data in ascending order.

• Second click sorts the data in descending order.

• Third click restores the original order.

  

Filtrável

É possível filtrar os dados dentro de cada coluna. Você pode filtrar os dados enquanto o formulário está sendo exibido.

Para filtrar dados em uma coluna:

1. Passe o mouse sobre o cabeçalho da coluna e clique na barra três menu.
2. Escolha uma operação de filtragem.
3. Input a value in the Filter field of the triple bar menu. The input value in the Filter field is a condition for the filtering operation.

Com base no tipo de dados, as seguintes operações de filtro estão disponíveis:

Operação de filtro	Texto	Número	Data/Hora
Contém	✅	❌	❌
Not Contains	✅	❌	❌
É igual a	✅	✅	✅
Not Equals	✅	✅	✅
Inicia com	✅	❌	❌
Termina com	✅	❌	❌
menor que	❌	✅	✅
menor ou igual	❌	✅	❌
maior que	❌	✅	✅
Maior ou igual	❌	✅	❌
No intervalo	❌	✅	✅
Em branco	✅	✅	✅
Não está em branco	✅	✅	✅