Versões comparadas
Chave
- Esta linha foi adicionada.
- Esta linha foi removida.
- A formatação mudou.
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.
Filtrar por parâmetros
Selecione a fonte de dados Estado 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 ao Pessoa.active.estado
Limpar estratégia
Definir dependência
Nessa página
Índice