- Criado por Deborah Melo de Carvalho, última alteração em 11/08/2020
Você está vendo a versão antiga da página. Ver a versão atual.
Comparar com o atual Ver Histórico da Página
« Anterior Versão 12 Próxima »
Introdução
Esse tutorial tem como objetivo mostrar aos usuários como utilizar os campos calculados da fonte de dados para criar filtros em sequência nas caixas de seleção dinâmica, quando existem tabela com relacionamento como, por exemplo, 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):
Classe | Atributos |
---|---|
País | id, pais (string) |
Estado | id, estado (string) |
Cidade | id, cidade (string) |
Pessoa | id, nome (string) |
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. Clique em 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 com 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. Primeiro, iremos trocar a fonte de dados Pessoa para a fonte de dados pessoa-custom (Figura 3.1). Então, selecione a fonte de dados que contém a entidade 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
Em seguida, selecione o campo nome, adicione o componente caixa de seleção dinâmica e vincule com a entidade estado (Figura 3.2) e adicione novamente uma caixa de seleção dinâmica, mas, ao invés de vincular com a entidade estado, vincule com a entidade pais. 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.
Figura 3.3 - Vincular ng-model com a caixa de seleção
Filtrar por parâmetros
Selecione a fonte de dados Cidade e em propriedades, clique no ... que percente ao campo filtros e parâmetros (seta da Figura 3.4) para abrir sua janela. Adicione uma regra (1 da Figura 3.4) e informe que estado tem que ser igual à Pessoa.active.estado. Repita esse processo para a fonte de dados Estado, mas informe que pais tem que ser igual à Pessoa.active.pais na regra.
Figura 3.4 - Adicionando regra em filtros e parâmetros
Limpar estratégia
Novamente, selecione a fonte de dados Cidade e em propriedades, abra a caixa de seleção do campo estratégia em cláusula nula (Figura 3.5) e selecione a opção limpar dados. Repita esse processo para a fonte de dados Estado.
3.5 - Limpar dados para a estratégia em cláusula nula
Definir dependência
Por fim, vamos criar uma relação de dependência entre as fontes de dados. Sendo assim, selecione a fonte de dados Cidade e em propriedades, abra a caixa de seleção do campo dependente de salvamento e selecione Estado (Figura 3.6). Repita essa etapa para a fonte de dados Estado, mas selecione a opção País.
Figura 3.6 - Criando dependência de salvamento
Nessa página
- Sem rótulos