Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

...

Informações

A utilização da PK nos filtros ao utilizar dataset de Grupo, Papel ou Colaborador é opcional, porém o mesmo valor utilizado definição do zoom deve ser utilizado para a obtenção do valor selecionado, conforme exemplo abaixo.

 

Visualização e resgate destes valores

Para utilizar filtros a chamada é similar ao de dataFields.

Bloco de código
languagehtml/xml
window.open("/webdesk/zoom.jsp?datasetId=preCad&dataFields=codigo, Código, descricao, Descrição&resultFields=descricao&type=precad&filterValues=metadata_active, false","zoom" , "status, scrollbars=no, width=600, height=350, top=0, left=0");

Neste exemplo, o zoom irá retornar somente os registros de formulários inativos. 


Setar valor baseado na troca de valor de outro campo/zoom

Para realizar a busca de um valor em um campo de tipo zoom, com valores obtidos de outros campo zoom, deve-se ser utilizada primeiramente a função setSelectedZoom, que por parâmetro receberá o item selecionado pelo usuário no campo (selectedItem).

Bloco de código
function setSelectedZoomItem(selectedItem) {}

Dentro desta função, verificaremos o campo no qual vai pegar o valor do primeiro zoom, que no caso complementará o segundo:

Bloco de código
if(selectedItem.inputId == "id do campo"){}

Os id's dos campos de tipo zoom serão retornados em selectedItem.inputId, por este motivo devemos inserir esta validação, para que apenas o valor do campo certo seja retornado. Após o valor do campo estiver de acordo com sua opção, deverá ser utilizada a função reloadZoomFilterValues dentro da validação do nome do campo, que aplicará o filtro e recarregará o zoom.

 

Aplicando os valores:

Bloco de código
reloadZoomFilterValues("id_do_campo_de_zoom_que_receberá_o_filtro",
"campo_a_ser_filtrado," + selectedItem["valor_que_ira_filtrar"]);
Informações
titleImportante

 Espera-se um valor literal separado por vírgula após o campo a ser filtrado.

 

Código do exemplo completo:

Bloco de código
function setSelectedZoomItem(selectedItem) {
if(selectedItem.inputId == "id do campo"){
reloadZoomFilterValues("id_do_campo_de_zoom_que_receberá_o_filtro",
"campo_a_ser_filtrado," +
selectedItem["valor_que_ira_filtrar"]);
  }
}


 

 

Limpar valor baseado na troca de valor de outro campo/zoom

Para limpar valores que foram atribuídos por outro zoom, deverá ser criada uma função com as seguintes propriedades:

Bloco de código
filter_id_do_campo.on('fluig.autocomplete.itemRemoved',
function(ev) {
filter_id_do_campo.removeAll();
});

O nome da função fica a critério, no exemplo foi utilizada removeZoomFields:

Bloco de código
removeZoomFields(){
filter_idDoCampo.on('fluig.autocomplete.itemRemoved', function(ev) {
filter_idDoCampo.removeAll();
});

}

Para que os registros sejam removidos, esta função deve ser chamada na função onde os campos são selecionados, este exemplo pode ser complementado com o item de Setar valor baseado na troca de valor de outro campo/zoom:

Bloco de código
function setSelectedZoomItem(selectedItem) {
  if(selectedItem.inputId == "id do campo"){
   reloadZoomFilterValues("id_do_campo_de_zoom_que_receberá_o_filtro", 
"campo_a_ser_filtrado," + selectedItem["valor_que_ira_filtrar"]);
}
 removeZoomFields();
}

Esta função será chamada sempre que o algum registro do zoom for removido.

 

Evento que limpa o valor

Para remover itens selecionados no zoom, uma função deve ser criada, de modo que possa ser chamada por todo o fonte do formulário. Para implementar a remoção de limpeza de valor, deve-se criar uma função com o seguinte código:

Bloco de código
filter_idDoCampo.removeAll();

E então os campos serão totalmente limpos.


Qual a diferença entre os componentes Filter e Autocomplete?

Autocomplete e filters possuem o mesmo propósito, fornecem o preenchimento automático, porém com comportamentos diferentes. Filters possibilitam combinar informações onde o usuário pode comparar resultados através de uma datatable, podendo então selecionar os registros de seu interesse. Já o Autocomplete, gerenciam o preenchimento automático de registros e tags.

 

Exemplos de utilização de Filter e Autocomplete

  •  O usuário necessita de uma consulta rápida de registros de um dataset, um Autocomplete é o ideal para esses casos, já que possui uma consulta rápida e resultados objetivos.
  •  Caso o usuário necessite de mais informações e maior customização da datatable ele pode utilizar o filter.

 

Bloquear e Habilitar zoom novo baseado em algum campo 

Para bloquear e desbloquear um campo de tipo zoom, com base em outro campo, devemos implementar no campo a ser validado, o evento onBLur no HTML apontando para uma função que fará toda a validação e realizará o bloqueio dos campos. Como exemplo, faremos a função:

Evento onBlur no input passando na função 'this.value', que vai mandar o valor que foi preenchido no campo para a função:

Bloco de código
<input type="text" name="fieldName" id="fieldName" class="form-control"
onblur="validateFieldIsNull(this.value)">

Dentro desta função, será validado se o valor recebido pela função é nulo, e caso seja, bloqueie o campo zoom. Caso este valor não esteja nulo, deverá ser adicionado a condição else para re-habilitar o campo zoom.

Bloco de código
function validateFieldIsNull(valor){
if(valor != ""){
         window[$("input[name=tagNameDoZoom]").attr("filter-
instance")].disable(false);
       } else {
              window[$("input[name=tagNameDoZoom]").attr("filter-
instance")].disable(true);
       }
}           
Dica
titleDica

É possível definir manualmente um valor para campos do tipo zoom utilizando a técnica demonstrada neste exemplo, que está disponível em nosso repositório Git.

Informações

A antiga técnica para zoom ainda é suportada pela plataforma. Porém, recomendamos a utilização da técnica descrita acima que está de acordo com os padrões do fluig Style Guide e permite maior fluidez utilizando o componente.

Dica
titleDica

É possível definir manualmente um valor para campos do tipo zoom utilizando a técnica demonstrada neste exemplo, que está disponível em nosso repositório Git.

...

Zoom Externo

Em situações aonde os dados dos elementos externos ao fluig são muito volumosos é recomendada a construção de uma aplicação externa ao fluig que fará o papel de zoom para o usuário. Abaixo será descrita uma técnica JavaScript aonde será possível chamar uma aplicação externa e a mesma poderá devolver o dado solicitado pelo usuário para um campo do formulário do fluig.

...