Introdução

Esse tutorial tem como objetivo mostrar aos usuários em como utilizar os campos calculados da fonte de dados para criar filtros em sequência nas caixas de seleção dinâmica, como em relacionamentos de País-Estado-Cidade ou Base-Gerência-Setor.

Criar tabelas

Primeiramente vamos criar as tabelas e definir o relacionamento entre elas. Para isso, crie um novo diagrama de dados dentro da pasta diagrama e adicione as seguintes classes e atributos nesse diagrama (como mostrado na Figura 1):

Após adicionar as classes e atributos, faça o relacionamento do tipo 1 para N entre as seguintes classes:

• País (1) - Estado (N)
• Estado (1) - Cidade (N)
• Cidade (1) - Pessoa (N)

Por fim, salve o diagrama, gere a persistência e o CRUD de todas as classes.

Figura 1 - Resultado final do diagrama

Criar fonte de dados

Após ter gerado o CRUD das tabelas, vamos criar uma fonte de dados. No menu do sistema > Projeto > Fonte de Dados e adicione uma fonte de dados (Figura 2.1).

Figura 2.1 - Criar fonte de dados

Adicionar campos calculados

Adicione um nome para a fonte de dados e vincule a tabela Pessoa (1 da Figura 2.2). Clique na aba campos calculados e crie os campos estado e pais, os associando respectivamente aos seus IDs - ou seja, as expressões this.cidade.estado.id e this.cidade.estado.pais.id (2 e 3 da Figura 2.2). Por fim, salve a fonte de dados.

Figura 2.2 - Vinculando entidade e adicionando os campos

Modificando CRUD

do formulário

Abra a view criada da tabela Pessoa. Primeiramente, iremos trocar a fonte de dados Pessoa para a fonte de dados pessoa-custom (Figura 3.1). Selecione a fonte de dados que contém o Pessoa, clique na aba propriedades e clique no ... em origem de dados e selecione pessoa-custom.

Figura 3.1 - Trocar fonte de dados

Adicionar caixa de seleção

Após, selecione o campo nome, adicione o componente caixa de seleção dinâmica e vincule com a entidade estado (Figura 3.2) e repita o processo, mas vincule com a entidade pais dessa vez. Além disso, renomeie as labels das caixas para Estado e País respectivamente.

Figura 3.2 - Vinculando entidade com a caixa de seleção dinâmica

Vincular ng-model

Selecione a caixa de seleção estado e em propriedades, abra as opções do campo Valor e selecione a opção Pessoa.active.estado. Repita esse processo para a caixa de seleção país, só que selecionando a opção Pessoa.active.pais.

Filtrar por parâmetros

Limpar estratégia

Definir dependência